← وبلاگ

⁦Text.js 1.0⁩

⁦Text.js 1.0⁩ پایدار است. برنامه‌های ⁦React 19⁩ و ⁦App Router⁩ را با یک console.log در هر فریم در کنسول DevTools رندر می‌کند.

Adam

امروز ⁦Text.js 1.0⁩، فریم‌ورک کنسول برای وب را منتشر می‌کنیم.

bunx create-text-app@latest

⁦Text.js⁩ برنامه‌های ⁦React 19⁩ را در کنسول ⁦Chrome DevTools⁩ رندر می‌کند و چیدمان‌ها، مسیریابی، فوکوس، ورودی، فرم‌ها، نمودارها و Markdown جریانی را با console.log ترسیم می‌کند.

امکانات 1.0

  • ⁦App Router⁩. فایل‌های layout.tsx، page.tsx، [param]، loading.tsx، error.tsx، not-found.tsx و api/*/route.ts، همگام با window.location. از قراردادهای ⁦App Router⁩ در Next.js پیروی می‌کند.
  • Turbolog. ⁦Yoga flexbox⁩ شبکه‌ای از سلول‌ها را می‌چیند، یک CellBuffer مبتنی بر آرایهٔ نوع‌دار آن را نگه می‌دارد و یک رمزگذار طول اجرا آن را به یک فراخوانی console.log(format, ...css) تبدیل می‌کند. فریم‌های بیکار هیچ فراخوانی کنسولی ندارند.
  • کیت کامپوننت‌ها. Box، Text، ScrollBox، Input، Select، Tabs، Markdown، Diff، کامپوننت مجازی‌سازی‌شدهٔ List، Table، Tree، نمودارها، کادرهای محاوره‌ای، اعلان‌های گذرا و پالت فرمان Ctrl+K از useKeymap.
  • افزودن فریم‌ها به انتها. فریم‌ها زیر فریم قبلی به انتها افزوده می‌شوند، بنابراین کنسول بین فریم‌ها لحظه‌ای خالی نمی‌شود. اطلاعات بیشتر در Turbolog: حذف چشمک‌زدن.
  • متن راست‌به‌چپ. عبری و عربی با ترتیب بصری و شکل‌دهی حروف عربی رندر می‌شوند؛ این کار بر پایهٔ پیاده‌سازی ⁦UAX #9⁩ است که هر 770,241 مورد آزمون BidiTest.txt را با موفقیت می‌گذراند. متن راست‌به‌چپ در کنسول را ببینید.
  • کنسول واکنش‌گرا. Text.js خود را با پنل متصل DevTools تطبیق می‌دهد و بزرگ‌نمایی صفحه و نوار ابزار چندخطی را هم در نظر می‌گیرد. در حالت جداشده، به اندازهٔ 120×36 برمی‌گردد.
  • text run. همان برنامهٔ ⁦App Router⁩ در یک ترمینال واقعی رندر می‌شود.
  • ابزارهای عامل‌ها و ویرایشگرها. دستور text mcp برنامهٔ شما را از طریق پروتکل ⁦Model Context⁩ در اختیار عامل‌های کدنویسی قرار می‌دهد و افزونهٔ ⁦Text.js DevTools⁩ پنلی کنار «کنسول» اضافه می‌کند. بستهٔ eslint-plugin-textjs و یک افزونهٔ ⁦VS Code⁩ هم بخشی از 1.0 هستند.

یک تغییر نام

بستهٔ فریم‌ورک اکنون @textjs/next است. نام textjs در npm گرفته شده بود. دستورهای import خود را به‌روزرسانی کنید:

- 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 span⁩ از نوع %c)، اندازه‌گیری‌شده با 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 جریانی و بازی مار دارد. OpenCode به سرور محلی OpenCode شما متصل می‌شود.

فهرست کامل تغییرات در گزارش تغییرات و کد منبع در GitHub است.