NoDiff は、リッチクライアントアプリ向けの小さな TypeScript フレームワークです。最大の特徴は、TSX を「ブラウザの構文」として扱うことです。Vite でコンパイルすると、JSX は @nodiffjs/core/jsx-runtime への呼び出しになり、仮想 DOM を構築せずに HTMLElement を直接生成します。props の適用、イベントリスナーの登録、子ノードの追加もこのランタイムが行い、React のような再実行や差分パスは不要です。
リポジトリは fork-first の monorepo 構成で、フレームワーク本体 packages/nodiff（公開名 @nodiffjs/core）とデモアプリ apps/demo が同居しています。デモは Vite と TypeScript のエイリアスを使って packages/nodiff/src を直接参照するため、フレームワークとアプリのコードを同じワークスペースで編集でき、エディタ上での移動や HMR もソースに対して機能します。dist へのビルドはあくまで公開/利用時のチェックとして維持されています。
NoDiff は、ブラウザが元々持つ DOM、イベント、fetch、AbortController、localStorage、history などのプリミティブを活かし、その上に必要な TypeScript の型安全な表面を提供します。TSX の JSX ランタイム、mount/append、ライフサイクル cleanup、text/view/For などの状態バインディング、zustand/vanilla 互換ストア、zod で検証する API クライアント、TTL 付きキャッシュ、トークン認証、ルーター、フォーム、CSRF 補助などが含まれます。
セキュリティも重視されています。DOM テキストは構造的にエスケープされ、innerHTML は特別なラッパーなしでは拒否されます。URL 属性はスキームとオリジンが検査され、_blank には noopener noreferrer が付与されます。configureSecurityPolicy による全体ポリシー、createApi の厳格なリクエスト処理、createAuth のデフォルト永続化なしなどの設計により、安全な使い方が最短ルートになるよう意識されています。エラー表示も既定で redact され、スタックトレースや秘密情報が UI に漏れにくくなっています。
デモアプリは JSONPlaceholder を使い、/posts では zod スキーマを通してデータを検証してから UI 状態に入れます。README には、ストア作成から TSX による実 DOM 描画、text によるテキスト更新、view/For による領域再描画、API クライアントの zod 検証までを順に学ぶチュートリアルもあります。Bun workspaces、Vite 8、TypeScript 7 native preview、oxlint、oxfmt といった現行ツールチェーンも特徴です。