Text.js 1.0
Text.js 1.0 é estável. Ele renderiza apps React 19 e App Router no console do DevTools com um console.log por quadro.
Hoje lançamos o Text.js 1.0, o framework de console para a Web.
bunx create-text-app@latestO Text.js renderiza apps React 19 no console do Chrome DevTools, com layouts, roteamento, foco, entrada de dados, formulários, gráficos e Markdown em streaming desenhados com console.log.
Novidades da versão 1.0
- O App Router.
layout.tsx,page.tsx,[param],loading.tsx,error.tsx,not-found.tsxeapi/*/route.ts, sincronizados comwindow.location. Ele segue as convenções do App Router do Next.js. - Turbolog. O Yoga flexbox organiza uma grade de células, um
CellBufferde arrays tipados a armazena, e um codificador por comprimento de sequência a transforma em uma única chamada aconsole.log(format, ...css). Quadros ociosos não fazem chamadas ao console. - Um kit de componentes.
Box,Text,ScrollBox,Input,Select,Tabs,Markdown,Diff,Listvirtualizada,Table,Tree, gráficos, caixas de diálogo, notificações toast e uma paleta de comandosCtrl+KdouseKeymap. - Quadros anexados. Os quadros são anexados abaixo do anterior, para que o console não pisque vazio entre quadros. Mais sobre isso em Turbolog: eliminando a piscada.
- Texto da direita para a esquerda. Hebraico e árabe são renderizados em ordem visual com modelagem de caracteres árabes, a partir de uma implementação do UAX #9 que passa em todos os 770.241 casos de
BidiTest.txt. Veja Texto da direita para a esquerda no console. - Um console responsivo. O Text.js se ajusta ao painel acoplado do DevTools, incluindo o zoom da página e uma barra de ferramentas com quebra de linha. Quando desacoplado, usa
120×36como padrão. text run. O mesmo app App Router é renderizado em um terminal real.- Ferramentas para agentes e editores.
text mcpdisponibiliza seu app para agentes de programação pelo Model Context Protocol, e a extensão Text.js DevTools adiciona um painel ao lado de “Console”.eslint-plugin-textjse uma extensão para VS Code também fazem parte da versão 1.0.
Uma mudança de nome
O pacote do framework agora é @textjs/next. O nome textjs já estava em uso no npm. Atualize suas importações:
- import { Box, Text } from "textjs";+ import { Box, Text } from "@textjs/next";Atualização, 1.0.2: o pacote agora é @textjs/app, e @textjs/next está descontinuado. Para mudar, execute bun remove @textjs/next && bun add @textjs/app e importe de @textjs/app.
Números
Em um dashboard denso de 100×32 (46 nós de texto, 149 spans %c), medido com packages/core/test/perf.test.ts:
| Quadro | Média |
|---|---|
| Repintura completa (layout, pintura, codificação) | 0,163 ms |
| Edição de uma linha (digitação) | 0,011 ms |
| Ocioso | 0,000 ms, 0 chamadas ao console |
Um quadro sem alterações retorna antes de alocar uma string, então quadros ociosos medem 0,000 ms.
Experimentar
Abra textjs.org e pressione ⌘⌥J (Ctrl+Shift+J no Windows e no Linux). O site executa um app Text.js no seu console, com uma visualização por página. O Playground tem um dashboard, Markdown em streaming e Snake. O OpenCode se conecta ao seu servidor OpenCode local.
A lista completa de mudanças está no registro de alterações, e o código-fonte está no GitHub.