chenglou/pretext

O que é?

Recursos principais

• 01Calcula a altura e o número de linhas de um parágrafo sem reflow do DOM, usando `prepare()` e `layout()`.
• 02Retorna linhas individuais, larguras de linha e cursores para layouts manuais.
• 03Inclui uma API rica para conteúdo inline com fontes variadas, trechos de código e caixas inline.
• 04Oferece suporte a `pre-wrap`, à quebra de palavras `keep-all` e ao espaçamento entre letras.
• 05Renderiza os resultados no DOM, Canvas ou SVG.

Casos de uso

• Virtualizar listas longas sabendo a altura de cada item antes da renderização.
• Ajustar balões de chat à largura da linha mais longa.
• Fazer o texto contornar imagens flutuantes, com linhas de larguras variadas.
• Verificar durante o desenvolvimento se os rótulos dos botões não quebram para uma segunda linha.

Início rápido

1. 1

   Instale o pacote pelo npm

   npm install @chenglou/pretext
2. 2

   Importe prepare e layout e, em seguida, meça a altura de um parágrafo sem tocar no DOM

Antes de usar

• !A licença está indicada como NOASSERTION, então os termos de uso não estão claros e devem ser verificados antes da adoção.
• !A medição depende do mecanismo de fontes do navegador, portanto os resultados exatos variam conforme as fontes disponíveis.

Tópicos

Perguntas frequentes

O que é pretext?

Biblioteca pura de JavaScript/TypeScript que mede e organiza texto em várias linhas sem provocar reflow do DOM nem renderizar no DOM, Canvas ou SVG. Pretext mede textos em várias linhas e calcula as quebras de linha em JavaScript ou TypeScript puro, para que o código de layout possa obter a altura de um parágrafo ou suas linhas individuais sem ler `getBoundingClientRect` ou `offsetHeight`. Essas leituras do DOM forçam o navegador a recalcular o layout da página, o que é custoso. Pretext usa a medição de texto do Canvas do navegador como fonte das larguras e aplica sua própria lógica de quebra de linha.

pretext é gratuito? Qual é a licença?

pretext é open source sob a licença Other. Confira os termos da licença antes de usá-lo em produtos comerciais.

pretext ainda é mantido?

Manutenção ativa. O último commit de pretext foi em 15 de out. de 2026.

Para que posso usar pretext?

Virtualizar listas longas sabendo a altura de cada item antes da renderização. Ajustar balões de chat à largura da linha mais longa. Fazer o texto contornar imagens flutuantes, com linhas de larguras variadas. Verificar durante o desenvolvimento se os rótulos dos botões não quebram para uma segunda linha.

Como instalar pretext?

Instale o pacote pelo npm: npm install @chenglou/pretext Importe prepare e layout e, em seguida, meça a altura de um parágrafo sem tocar no DOM

Onde consigo pretext?

O código-fonte e as instruções de instalação estão no GitHub: https://github.com/chenglou/pretext