Midjourney Engineer Open-Sources Pretext: A Zero-Dependency JS/TS Text Layout Library to Avoid Layout Reflow

Cheng Lou, a Midjourney engineer and author of the React animation library react-motion, recently open-sourced Pretext—a zero-dependency JavaScript/TypeScript text measurement and layout library. It bypasses browser DOM measurements (like getBoundingClientRect and offsetHeight) to avoid layout reflow, using pure arithmetic for text height calculation and line wrapping.

Pretext works in two stages: prepare() measures character widths once via Canvas API, and layout() uses cached data for pure arithmetic operations. In a benchmark test with 500 text segments, prepare() takes about 19ms, while layout() only needs 0.09ms—showing significant performance improvement.

The library supports full languages like Chinese, Japanese, Korean, Arabic, as well as emojis and mixed bidirectional text. It can render to DOM, Canvas, or SVG. Typical use cases include virtual lists, waterfall layouts, adaptive chat bubbles, etc.