Text.js 1.0
Text.js 1.0 es estable. Renderiza apps de React 19 y App Router en la consola de DevTools con un console.log por fotograma.
Hoy lanzamos Text.js 1.0, el framework de consola para la web.
bunx create-text-app@latestText.js renderiza apps de React 19 dentro de la consola de Chrome DevTools, con layouts, enrutamiento, foco, entrada de datos, formularios, gráficos y Markdown en streaming dibujados con console.log.
Novedades de 1.0
- El App Router.
layout.tsx,page.tsx,[param],loading.tsx,error.tsx,not-found.tsxyapi/*/route.ts, sincronizados conwindow.location. Sigue las convenciones del App Router de Next.js. - Turbolog. Yoga flexbox organiza una cuadrícula de celdas, un
CellBufferde arrays tipados la almacena y un codificador de longitud de secuencias la convierte en una única llamada aconsole.log(format, ...css). Los fotogramas inactivos no hacen llamadas a la consola. - Un kit de componentes.
Box,Text,ScrollBox,Input,Select,Tabs,Markdown,Diff,Listvirtualizada,Table,Tree, gráficos, diálogos, notificaciones y una paleta de comandosCtrl+KdeuseKeymap. - Fotogramas añadidos al final. Los fotogramas se añaden al final, debajo del anterior, para que la consola no parpadee en blanco entre fotogramas. Más información en Turbolog: eliminar el parpadeo.
- Texto de derecha a izquierda. El hebreo y el árabe se renderizan en orden visual con conformación de caracteres árabes, mediante una implementación de UAX #9 que supera los 770.241 casos de
BidiTest.txt. Consulta Texto de derecha a izquierda en la consola. - Una consola adaptable. Text.js se ajusta al panel acoplado de DevTools, incluidos el zoom de la página y una barra de herramientas que se distribuye en varias líneas. Cuando está desacoplado, usa
120×36como alternativa. text run. La misma app de App Router se renderiza en una terminal real.- Herramientas para agentes y editores.
text mcpsirve tu app a agentes de programación mediante el Model Context Protocol, y la extensión Text.js DevTools añade un panel junto a «Consola».eslint-plugin-textjsy una extensión de VS Code también forman parte de 1.0.
Un cambio de nombre
El paquete del framework ahora es @textjs/next. El nombre textjs ya estaba ocupado en npm. Actualiza tus importaciones:
- import { Box, Text } from "textjs";+ import { Box, Text } from "@textjs/next";Actualización, 1.0.2: el paquete ahora es @textjs/app, y @textjs/next está obsoleto. Para cambiar, ejecuta bun remove @textjs/next && bun add @textjs/app e importa desde @textjs/app.
Cifras
En un panel denso de 100×32 (46 nodos de texto, 149 spans %c), medido con packages/core/test/perf.test.ts:
| Fotograma | Media |
|---|---|
| Repintado completo (layout, pintado, codificación) | 0,163 ms |
| Edición de una fila (al escribir) | 0,011 ms |
| Inactivo | 0,000 ms, 0 llamadas a la consola |
Un fotograma sin cambios retorna antes de asignar memoria para una cadena, por lo que los fotogramas inactivos registran 0,000 ms.
Probar
Abre textjs.org y pulsa ⌘⌥J (Ctrl+Shift+J en Windows y Linux). El sitio ejecuta una app de Text.js en tu consola, con una vista por página. El Playground tiene un panel, Markdown en streaming y Snake. OpenCode se conecta a tu servidor local de OpenCode.
La lista completa de cambios está en el registro de cambios, y el código fuente está en GitHub.