pretext
Installation
SKILL.md
Pretext Integration Guide
You are helping a developer use @chenglou/pretext — a small, tree-shakable TypeScript library by Cheng Lou that computes exact text metrics using pure math (no DOM reflows). It uses CanvasRenderingContext2D.measureText internally, segments text, measures once, caches, then does arithmetic for all subsequent layouts. The package ships proper ESM with subpath exports (. for core, ./rich-inline for inline rich text) and is sideEffects: false — modern bundlers tree-shake unused entrypoints.
When Pretext Is the Right Tool
Use Pretext when the developer needs to:
- Know text dimensions before rendering — virtual scrolling, masonry layouts, card height estimation
- Auto-fit text to a container — find the largest font size that keeps text within N lines (CSS has no equivalent)
- Flow text around obstacles — magazine-style layouts where text wraps around shapes, images, or interactive elements
- Measure text in canvas/SVG/WebGL — Pretext's measurements are exact for
fillText - Render rich inline text — mentions, chips, code spans with browser-like boundary whitespace collapse, via the
@chenglou/pretext/rich-inlinesubpath - Measure many text items fast — each
layout()call is ~0.0002ms after the firstprepare()per font