pretext 0.0.8 / DOM-free text layout

know where text lands
before you render it

Pretext is a JavaScript text-layout engine. It returns line breaks before text nodes exist—useful for Canvas, editors, PDFs, games, and virtual lists.

the problem

render first, learn geometry later

Browser defaultinsert DOM → read geometry → adjust

With Pretextprepare text once → query line ranges → render

Why care? Canvas tools, editors, PDFs, games, and virtual lists can know text geometry before committing pixels or DOM nodes.

checking the type case…

01 / variable-width line breaking

shape text before drawing

Try it: drag left from the blue edge. Each row becomes a different available width.

A message about making room changes line breaks as you draw a right-hand boundary.

02 / rich inline constraints

know whether mixed content fits

Try it: change the card size or remove the stamp. Pretext measures prose and the indivisible stamp as one stream.

Live composition will begin after the local type engine is ready.

card allows

text needs

measuring the first composition…

choose a physical box
edit the measured message optional

fit pending

03 / predictive height at scale

place rows before they exist

Try it: jump to record 9000. Pretext predicts wrapped text heights; the host virtualizer mounts only what is visible.

10,000row heights predicted

virtual document

0DOM rows mounted

waiting for predicted offsets…

When this act enters view, Pretext predicts every row height. The browser then mounts only this visible window.

10,000 records · preparing local type templates

how this was made

decision / one causal artifact

draw → fit → dispatch

Three independent concept lanes produced fifteen candidates. A context-blind judge selected these acts because they expose streaming line ranges, rich-inline atomic fitting, and predictive virtualization without repeating one interaction.

what Pretext does—and does not do

Pretext supplies measured source ranges and text heights without DOM measurement. This page owns the Canvas drawing, shoreline corridor, postcard format search, fit explanation, 10,000-row virtualizer, and accessibility semantics. In short: Pretext answers “what fits?”; the host decides what to do with that answer.

sources & boundaries

Rejected finalists included a paragraph optimizer, player-piano score, grapheme cabinet, and tidal almanac. They were stronger alone than together: the chosen sequence gives one message a legible journey from wonder to control to scale.

fallback & evaluation

The semantic page remains readable if the local module, Canvas 2D, Intl.Segmenter, or bundled font cannot initialize. Live controls stay disabled rather than simulating measurements.

Release checks cover source continuity, chip atomicity, mounted-row bounds, keyboard/touch operation, reduced motion, mobile overflow, asset hashes, and local/live parity.