DOMリフローなしでテキストを計測・配置する
pretext は、ブラウザのフォントエンジンを直接利用し、DOM操作なしでマルチラインテキストの計測とレイアウトを行うTypeScriptライブラリ。prepare() で一度テキストを解析すれば、layout() は純粋な算術演算で高さを返す。500テキストの処理に19ms、1回のレイアウト計算は0.09msと高速。
対応範囲が広い。全言語・全書字体系、絵文字、双方向テキストをサポートし、DOM・Canvas・SVG・サーバーサイドと出力先を選ばない。
layoutWithLines() や walkLineRanges() を使えば、障害物を避けたテキスト配置や可変幅のレイアウトも実現できる。CSSの white-space: normal と pre-wrap に対応し、標準的なテキスト表示のルールに準拠している。
npm install @chenglou/pretext