← المدونة

⁦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 تطبيقات ⁦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⁩ يجتاز جميع حالات BidiTest.txt البالغ عددها 770,241. راجع نص من اليمين إلى اليسار في وحدة التحكم.
  • وحدة تحكم متجاوبة. يتكيف Text.js مع لوحة DevTools المثبتة، بما يشمل تكبير الصفحة وشريط أدوات يلتف على أسطر. وعند فصلها، يعود إلى 120×36.
  • text run. يُعرض تطبيق ⁦App Router⁩ نفسه في طرفية حقيقية.
  • أدوات للوكلاء والمحررات. يتيح text mcp تطبيقك لوكلاء البرمجة عبر بروتوكول سياق النموذج، ويضيف امتداد ⁦Text.js DevTools⁩ لوحة بجوار «وحدة التحكم». وتشمل النسخة 1.0 أيضًا eslint-plugin-textjs وامتدادًا لمحرر ⁦VS Code⁩.

تغيير اسم واحد

أصبحت حزمة إطار العمل الآن @textjs/next. كان الاسم textjs محجوزًا على npm. حدّث عبارات الاستيراد:

- 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⁩ (⁦Ctrl+Shift+J⁩ على Windows و Linux). يشغّل الموقع تطبيق Text.js في وحدة التحكم لديك، بعرض واحد لكل صفحة. يحتوي Playground على لوحة معلومات وMarkdown متدفق ولعبة الثعبان. يتصل OpenCode بخادم OpenCode المحلي لديك.

توجد قائمة التغييرات الكاملة في سجل التغييرات، والشفرة المصدرية على GitHub.