Introducing json-render
— Chris Tate (@ctatedev) January 15, 2026
AI-generated UI. Deterministic output.
1. Define your component catalog
2. AI steams JSON
3. Render interactive UI
Let users prompt dashboards, widgets and apps - safely constrained to components and actions you define pic.twitter.com/WFSQ92w7vW
This has been 10 years in the making.
— Chris Tate (@ctatedev) January 15, 2026
And it's open source.https://t.co/FcBCc0qDHE
AI 中文摘要Claude 生成
「json-render」是由 Vercel Labs 開發的生成式 UI 框架。該框架允許開發者透過 AI 從自然語言提示生成動態、個性化的介面,同時確保可靠性和安全性。
核心運作原理為三步驟:定義組件目錄,讓 AI 生成 JSON 規格,最後渲染互動式使用介面。開發者設定安全護欄,限制 AI 只能使用預定義的組件和動作,確保輸出始終符合預期的結構和行為。
json-render 支援多平台渲染,包括 React、Vue、Svelte 網頁應用,以及 React Native 行動應用。此外還支援 Remotion 影片生成、React PDF 文件、React Email 電子郵件和 SVG/PNG 圖像輸出。框架提供 36 個預先構建的 shadcn/ui 組件,開發者可直接使用。
關鍵特性包括流式輸出以漸進式渲染,動態屬性綁定狀態,條件可見性控制,以及動作與狀態監控機制。系統提示會根據目錄自動生成,確保 AI 了解可用組件及其限制條件。
該項目已醞釀十年,現作為開源專案發布,適合需要安全、可預測的 AI 生成介面的應用場景。
