Text.js
डॉक्स/शुरुआत

परिचय

Text.js क्या है, इसमें क्या शामिल है और फ़्रेम कैसे रेंडर होता है।

Text.js उन ऐप्स के लिए एक React फ़्रेमवर्क है जो console.log से DevTools कंसोल में रेंडर होते हैं।

लाइव↑ ↓ count · r resettsx
preview://counter:1
import { useState } from "react";import { Box, Text, useInput } from "@textjs/app";export default function Page() {  const [count, setCount] = useState(0);  useInput((e) => {    if (e.key === "up") setCount((c) => c + 1);    if (e.key === "down") setCount((c) => c - 1);  });  return (    <Box className="flex-col p-1 border rounded">      <Text bold>count = {count}</Text>    </Box>  );}

प्रीव्यू लाइव है। उस पर क्लिक करें और ↑ दबाएं।

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

  • React 19: कंकरेंट रेंडरिंग, Suspense और एरर बाउंड्री।
  • App Router: लेआउट, पेज, डायनामिक सेगमेंट और रूट हैंडलर।
  • Yoga लेआउट: WebAssembly में flexbox, पूर्णांक सेल पर स्नैप किया गया।
  • Turbolog: हर बदले हुए फ़्रेम के लिए एक console.log कॉल।
  • कंसोल UI: पेज पर सिर्फ़ एक फ़ोकस पैड और एक छिपा हुआ इनपुट होता है।

काम करने का तरीका

स्टेट नीचे की ओर बहता है: React, फिर लेआउट, फिर सेल बफ़र, फिर कंसोल।

React 19 ▼ Yoga ▼ CellBuffer ▼ console.log(format, ...css)

जिन फ़्रेम में बदलाव नहीं होता, उन्हें छोड़ दिया जाता है, इसलिए निष्क्रिय ऐप्स कुछ लॉग नहीं करते।

अगले कदम

GitHub पर यह पेज एडिट करें