Agent skill · software engineering · aradotso
pretext-text-measurement
Fast, accurate, DOM-free text measurement and layout library for JavaScript/TypeScript supporting multiline, rich-text, and variable-width layouts.
Why this skill is useful
Provides domain-specific methods for text measurement and layout that are not commonly known or available in standard libraries.
What it needs
Requires @chenglou/pretext installed locally. About 5k tokens when loaded. Last updated 2026-07-09. 70 stars on the source repository.
What this skill does
Pretext Text Measurement & Layout Skill by ara.so — Daily 2026 Skills collection. Pretext is a pure JavaScript/TypeScript library for fast, accurate, DOM-free multiline text measurement and layout. It avoids getBoundingClientRect and offsetHeight (which trigger expensive layout reflows) by implementing its own measurement logic using the browser's font engine as ground truth. Installation Core Concepts prepare() / prepareWithSegments() — one-time analysis: normalize whitespace, segment text, measure via canvas. Cache and reuse this result. layout() / layoutWithLines() etc. — cheap hot path: pure arithmetic over cached widths. Call this on every resize, not prepare(). Font string format — same as CanvasRenderingContext2D.font, e.g. '16px Inter', '700 18px "Helvetica Neue"'. Use Case 1: Measure Paragraph Height (No DOM) With Pre-wrap (textarea-like) With CJK keep-all Use Case 2: Manual Line Layout Get All Lines at Fixed Width Line Stats Without Building Strings Natural Width (No Wrap Constraint) Variable-Width Layout (Text Around Floated Image) Iterator API (Fixed Width, With Text Strings) Use Case 3: Rich Inline Text Flow For mixed fonts, chips, @mentions, and inline code spans: Rich Inline Stats Common Patterns Virtualized List Row Heights Binary Search for Balanced Text Width Resize Handler Pattern Prevent Layout Shift on Dynamic Content API Quick Reference Use Case 1 (Height Only) Function Description --- --- prepare(text, font, opts?) One-time analysis, returns PreparedText layout(prepared, maxWidth, lineHeight) Returns { height, lineCount } Use Case 2 (Manual Layout) Function Description --- --- prepareWithSegments(text, font, opts?) One-time analysis, returns PreparedTextWithSegments layoutWithLines(prepared, maxWidth, lineHeight) Returns { height, lineCount, lines[] } walkLineRanges(prepared, maxWidth, onLine) Calls onLine per line, no string allocs measureLineStats(prepared, maxWidth) Returns { lineCount, maxLineWidth } only measureNaturalWidth(prepared) Widt …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills aradotso/pretext-text-measurement