Layoutmaster

320,000 word novel
343,912px masonry wall
882.9ms on base Pixel 10 phone
Powered by game engine technology

Asking the DOM for layout is like confessing to the police, then asking for leniency.

Layoutmaster computes text layout without reflow — returning exact coordinates, baselines, and paint metadata for every fragment. Tell the DOM where to paint. Don't let it decide.

The Problem

The browser cannot tell you where things go until it has already put them there.

Ask that too often, too fast, and it thrashes.

Tools like chenglou's pretext help by measuring text without DOM and returning the heights — but that is like asking for the blueprint of a house and getting handed a ruler.

Layoutmaster solves the full layout first, then hands you the job tickets: exact coordinates, baselines, and paint metadata for every fragment. No reflow. Whether you render with HTML, canvas, or WebGL doesn't matter.

It's also blindingly fast — powered by game engine internals, not browser heuristics. Your browser stops thrashing and starts painting.

The Six Mantras

form() Given a width, how does this lay out and how tall does it get? No DOM. No rendering. Just pieces. Demo →
fit() Given a bounded box, what fits and what overflows? Every character accounted for. Nothing disappears quietly. Demo →
plan() Parse once, never re-measure. The same plan drives form(), fit(), and flow() without repeating any work. The Book Masonry demo runs on this. Demo →
flow() Content does not always fit in one box. flow() carries text through multiple regions — columns, panels, spreads. Demo →
pour() Not every surface is a rectangle. Fill any shape — a circle, a polygon, an image silhouette, a video frame. Demo →
produce() Hand it a document. Get back pages. Publishing-grade pagination. Demo →
A piece is the engine's entire output contract — { kind, text, x, y, width, height, baselineY, lineIndex, pieceIndex, fontFamily, fontSize, color, … } — returned by every mantra. The job ticket. You paint it.

Get the Master

Let the master
handle layout.

npm install @layoutmaster/layoutmaster

179 KiB gzip · no WebAssembly · no other dependencies · browser-native font metrics · full bidi support