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-inline subpath
  • Measure many text items fast — each layout() call is ~0.0002ms after the first prepare() per font

When NOT to Use Pretext

Installs
14
GitHub Stars
14
First Seen
Apr 3, 2026