"The future of text layout is not CSS": Midjourney engineer open-sources Pretext

According to monitoring by 1M AI News, Cheng Lou, an engineer at Midjourney and the author of the React animation library react-motion, has open-sourced Pretext, a pure JavaScript/TypeScript text measurement and typography library with zero dependencies. Pretext bypasses browser DOM measurements (like getBoundingClientRect and offsetHeight) to avoid layout reflow, performing text height calculations and line breaks purely through arithmetic.

Pretext operates in two stages: prepare() measures character widths all at once using the Canvas API, while layout() performs pure arithmetic operations based on the cached width data. In a benchmark test with 500 segments of text, prepare() took about 19ms, and layout() only took 0.09ms. Cheng Lou wrote in a supporting article, “The performance improvement is not incremental but transformative: 0.05ms compared to 30ms, zero reflows compared to five hundred.”

The library supports all languages, including Chinese, Japanese, Korean, Arabic, as well as emojis and mixed-direction text, and can render to DOM, Canvas, and SVG. Typical application scenarios include:

1. Virtual lists and occlusion culling without guessing heights
2. JavaScript-driven custom layouts such as masonry layouts
3. Chat bubbles with multi-line text that adaptively shrink in width
4. Text wrapping around images for editing and typesetting