AI News HubLIVE
站內改寫2 分鐘閱讀

Show HN:NoDiff,一個執行在 monorepo 中的框架

NoDiff 是一個極簡 TypeScript 框架,將 TSX 視為瀏覽器原生語法,直接建立真實 DOM 節點,無需 React、虛擬 DOM 或排程器。它提供狀態繫結、zod 校驗、快取、認證、路由和表單等功能,並採用 fork-first 的 monorepo 工作流,讓框架與應用同步演化。

來源Hacker News AI作者: hbbio

NoDiff 是一個正在開發中的輕量 TypeScript 框架,目標是為富客戶端應用提供“剛好夠用”的執行時。它把 TSX 當作瀏覽器的語法來使用:透過 Vite 編譯後,JSX 會變成對 @nodiffjs/core/jsx-runtime 的呼叫,這些呼叫直接建立 HTMLElement 例項,並完成屬性設定、事件繫結和子節點掛載,整個過程不產生虛擬 DOM,也不做 diff 或元件重放。

這個專案採用 fork-first 的 monorepo 結構,倉庫裡同時包含框架包 packages/nodiff(釋出名為 @nodiffjs/core)和演示應用 apps/demo。開發時,演示應用透過 Vite 和 TypeScript 別名把 @nodiffjs/core 指向 packages/nodiff/src,因此修改框架原始碼和應用程式碼可以在同一個工作區裡即時熱更新;構建產物 dist 則被保留為釋出/消費前的檢查。作者認為,在 LLM 時代,應用和框架同庫演化更容易被開發者或編碼代理理解、修改和推理。

NoDiff 刻意利用瀏覽器原生能力,包括 DOM 樹、事件監聽、表單校驗、fetch、AbortController、localStorage、history/hashchange 和原生模組,只補充一層乾淨的 TypeScript 介面。它提供 JSX 執行時、mount/append 等 DOM 工具、生命週期清理、文本/區域/列表狀態繫結,併相容 zustand/vanilla 這類 store。資料層支援 zod 解析的 API 客戶端、帶 TTL 的 localStorage 快取、token 認證、資源狀態機,還包含雜湊/歷史路由、zod 表單和 CSRF 輔助。核心判斷是:即使沒有 React,TSX 依然很有用。

安全方面,NoDiff 預設把“安全路徑”變短:DOM 文本透過構造轉義,拒絕 innerHTML,除非顯式用 trustedHTML 或 sanitizeHTML;URL 屬性會做 scheme/origin 檢查,CSS 執行點被停用,_blank 連結自動加 noopener noreferrer。configureSecurityPolicy 可以安裝全域性策略,createApi 會限制跨域 auth 頭、強制請求超時和快取 schema,createAuth 預設只在記憶體儲存 token,持久化需要顯式開啟。渲染錯誤和路由異常預設顯示脫敏資訊,避免洩露堆疊。

演示應用圍繞 JSONPlaceholder 構建,路線包括 / 首頁狀態繫結、/posts 的 zod 校驗與快取、/auth 的模擬登入以及 /cache 的快取檢查。README 還附帶教程,從建立 zustand/vanilla store、用 TSX 渲染真實 DOM、text 繫結文本、view/For 重繪區域,到用 zod 解析 API 資料,逐步建立心智模型。工具鏈方面,專案使用 Bun workspaces、Vite 8、TypeScript 7 native preview、oxlint 和 oxfmt,並提供了 typecheck、lint、format、security:check 等指令碼。