← ब्लॉग

Text.js 1.0

Text.js 1.0 स्टेबल है। यह React 19 और App Router ऐप को DevTools कंसोल में हर फ़्रेम पर एक console.log के साथ रेंडर करता है।

Adam

आज हम Text.js 1.0 रिलीज़ कर रहे हैं, जो वेब के लिए कंसोल फ़्रेमवर्क है।

bunx create-text-app@latest

Text.js, Chrome DevTools कंसोल में React 19 ऐप रेंडर करता है, जहां लेआउट, रूटिंग, फ़ोकस, इनपुट, फ़ॉर्म, चार्ट और स्ट्रीमिंग Markdown को console.log से ड्रॉ किया जाता है।

1.0 में शामिल सुविधाएं

  • App Router। layout.tsx, page.tsx, [param], loading.tsx, error.tsx, not-found.tsx और api/*/route.ts, जो window.location के साथ सिंक रहते हैं। यह Next.js App Router के कन्वेंशन का पालन करता है।
  • Turbolog। Yoga flexbox सेल ग्रिड का लेआउट बनाता है, टाइप्ड-ऐरे CellBuffer उसे रखता है और रन-लेंथ एनकोडर उसे एक console.log(format, ...css) कॉल में बदलता है। आइडल फ़्रेम कोई कंसोल कॉल नहीं करते।
  • कंपोनेंट किट। Box, Text, ScrollBox, Input, Select, Tabs, Markdown, Diff, वर्चुअलाइज़्ड List, Table, Tree, चार्ट, डायलॉग, टोस्ट और useKeymap से बना Ctrl+K कमांड पैलेट।
  • जोड़े गए फ़्रेम। फ़्रेम पिछले फ़्रेम के नीचे जोड़े जाते हैं, इसलिए फ़्रेम के बीच कंसोल खाली होकर नहीं चमकता। इसके बारे में और पढ़ें: Turbolog: फ़्लैश को हटाना।
  • दाएं से बाएं टेक्स्ट। UAX #9 के ऐसे इंप्लीमेंटेशन से हिब्रू और अरबी, अरबी शेपिंग के साथ विज़ुअल क्रम में रेंडर होते हैं, जो BidiTest.txt के सभी 7,70,241 केस पास करता है। कंसोल में दाएं से बाएं टेक्स्ट देखें।
  • रिस्पॉन्सिव कंसोल। Text.js डॉक किए गए DevTools पैनल में फ़िट होता है, जिसमें पेज ज़ूम और रैप होने वाला टूलबार भी शामिल हैं। अनडॉक होने पर यह 120×36 का इस्तेमाल करता है।
  • text run। वही App Router ऐप असली टर्मिनल में रेंडर होता है।
  • एजेंट और एडिटर के लिए टूल। text mcp आपके ऐप को Model Context Protocol पर कोडिंग एजेंट के लिए उपलब्ध कराता है और Text.js DevTools एक्सटेंशन “कंसोल” के बगल में एक पैनल जोड़ता है। eslint-plugin-textjs और VS Code एक्सटेंशन भी 1.0 का हिस्सा हैं।

एक नाम में बदलाव

फ़्रेमवर्क पैकेज अब @textjs/next है। npm पर textjs नाम पहले से लिया जा चुका था। अपने इंपोर्ट अपडेट करें:

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

अपडेट, 1.0.2: पैकेज अब @textjs/app है और @textjs/next डेप्रिकेटेड है। स्विच करने के लिए bun remove @textjs/next && bun add @textjs/app कमांड चलाएं और @textjs/app से इंपोर्ट करें।

आंकड़े

घने 100×32 डैशबोर्ड (46 टेक्स्ट नोड, 149 %c span) पर, packages/core/test/perf.test.ts से मापा गया:

फ़्रेमऔसत
पूरा रीपेंट (लेआउट, पेंट, एनकोड)0.163 ms
एक पंक्ति में बदलाव (टाइपिंग)0.011 ms
आइडल0.000 ms, 0 कंसोल कॉल

जिस फ़्रेम में कोई बदलाव नहीं हुआ, वह स्ट्रिंग एलोकेट करने से पहले ही रिटर्न कर देता है, इसलिए आइडल फ़्रेम का मापा गया समय 0.000 ms है।

आज़माएं

textjs.org खोलें और ⌘⌥J दबाएं (Windows और Linux पर Ctrl+Shift+J)। साइट आपके कंसोल में Text.js ऐप चलाती है, हर पेज के लिए एक व्यू। Playground में डैशबोर्ड, स्ट्रीमिंग Markdown और Snake हैं। OpenCode आपके लोकल OpenCode सर्वर से कनेक्ट होता है।

बदलावों की पूरी सूची चेंजलॉग में है और सोर्स GitHub पर है।