Text.js 1.0

Heute veröffentlichen wir Text.js 1.0, das Konsolen-Framework für das Web.

bunx create-text-app@latest

Text.js rendert React-19-Apps in der Chrome-DevTools-Konsole, mit Layouts, Routing, Fokus, Eingaben, Formularen, Diagrammen und gestreamtem Markdown, gezeichnet mit console.log.

#Neuerungen in 1.0

• Der App Router. layout.tsx, page.tsx, [param], loading.tsx, error.tsx, not-found.tsx und api/*/route.ts, synchronisiert mit window.location. Er folgt den Konventionen des Next.js App Router.
• Turbolog. Yoga flexbox ordnet ein Zellenraster an, ein CellBuffer auf Basis typisierter Arrays hält es vor, und ein Lauflängen-Encoder wandelt es in einen einzigen Aufruf von console.log(format, ...css) um. Frames im Leerlauf erzeugen keine Konsolenaufrufe.
• Ein Komponentenbaukasten. Box, Text, ScrollBox, Input, Select, Tabs, Markdown, Diff, eine virtualisierte List, Table, Tree, Diagramme, Dialoge, Toasts und eine Ctrl+K-Befehlspalette aus useKeymap.
• Angehängte Frames. Frames werden unter dem vorherigen angehängt, sodass die Konsole zwischen Frames nicht kurz leer aufblitzt. Mehr dazu unter Turbolog: Das Aufblitzen beseitigen.
• Text von rechts nach links. Hebräisch und Arabisch werden in visueller Reihenfolge mit arabischer Zeichenformung gerendert, durch eine Implementierung von UAX #9, die alle 770.241 Testfälle aus BidiTest.txt besteht. Siehe Text von rechts nach links in der Konsole.
• Eine responsive Konsole. Text.js passt sich dem angedockten DevTools-Panel an, einschließlich Seitenzoom und einer umbrechenden Symbolleiste. Im abgedockten Zustand greift es auf 120×36 zurück.
• text run. Dieselbe App-Router-App rendert in einem echten Terminal.
• Werkzeuge für Agenten und Editoren. text mcp stellt deine App Coding-Agenten über das Model Context Protocol bereit, und die Text.js-DevTools-Erweiterung fügt neben „Konsole“ ein Panel hinzu. eslint-plugin-textjs und eine VS Code-Erweiterung gehören ebenfalls zu 1.0.

#Eine Umbenennung

Das Framework-Paket heißt jetzt @textjs/next. Der Name textjs war auf npm vergeben. Aktualisiere deine Imports:

- import { Box, Text } from "textjs";+ import { Box, Text } from "@textjs/next";

Update, 1.0.2: Das Paket heißt jetzt @textjs/app, und @textjs/next ist veraltet. Führe zum Wechseln bun remove @textjs/next && bun add @textjs/app aus und importiere aus @textjs/app.

#Zahlen

Auf einem dicht gefüllten 100×32-Dashboard (46 Textknoten, 149 %c-Spans), gemessen mit packages/core/test/perf.test.ts:

Bei einem unveränderten Frame kehrt die Funktion zurück, bevor sie einen String alloziert, daher messen Frames im Leerlauf 0,000 ms.

#Ausprobieren

Öffne textjs.org und drücke ⌘⌥J (Ctrl+Shift+J unter Windows und Linux). Die Website führt eine Text.js-App in deiner Konsole aus, mit einer Ansicht pro Seite. Der Playground bietet ein Dashboard, gestreamtes Markdown und Snake. OpenCode verbindet sich mit deinem lokalen OpenCode-Server.

Die vollständige Liste der Änderungen findest du im Änderungsprotokoll, den Quellcode auf GitHub.