solid

Solidは、ユーザーインターフェースを構築するためのオープンソースのJavaScriptライブラリです。その決定的な設計上の特徴は、仮想DOMの拒否にあります。テンプレートは実際のDOMノードにコンパイルされ、更新はきめ細かなリアクティブな反応を通じて適用されます。これにより、状態の一部が変更されたときに、それに依存するコードのみが再実行されます。 リアクティブモデル 開発者は、アクセサとセッターを返すcreateSignalなどのプリミティブを使用して状態を宣言します。派生値はアクセサを呼び出す通常の関数として表現され、依存関係の追跡は自動的に行われます。リアクティブな状態を読み取ると、周囲の計算がその状態を購読します。コンポーネントは、ビューをセットアップするために一度だけ実行される通常の関数であり、READMEではこれを「一度だけレンダリングする（render-once）」メンタルモデルと表現しています。ドキュメントでは、コンパイラが静的なHTMLをテンプレートに抽出し、動的な式を挿入することで、親要素を再レンダリングすることなく単一のテキストノードを更新できる仕組みを説明しています。 フレームワークの機能 このライブラリは、JSX、フラグメント、Context、Portals、Suspense、ストリーミングサーバーサイドレンダリング（SSR）、プログレッシブハイドレーション、Error Boundaries、およびコンカレントレンダリングを提供します。組み込みの状態管理はContextとStoresを通じて提供され、Resourcesを使用すると、サーバーからロードされたデータを他のリアクティブな状態と同様に扱い、Suspenseやコンカレントレンダリングでレスポンシブにレンダリングできます。READMEでは、ストリーミングとプログレッシブハイドレーションによるSSRおよびサーバーレスのサポートについて言及されています。 互換性と拡張性 Solidはアイソモーフィック（クライアントおよびサーバーレンダリング）かつユニバーサルであるとされており、他の環境で使用するためのカスタムレンダラーも利用可能です。Webコンポーネントに親和性が高く、コンパニオンパッケージであるsolid-elementを使用してカスタム要素を作成できます。JSXやTypeScript、Viteエコシステムと統合されており、JavaScriptおよびTypeScript用の公式テンプレートはdegit経由でスキャフォールディングできます。Babelプリセット（babel-preset-solid）とsolid-jsへの依存が推奨されるセットアップであり、TypeScriptではjsx: "preserve"とjsxImportSource: "solid-js"が必要です。プロジェクトサイトでは、インタラクティブなプレイグラウンドとチュートリアルが提供されています。 掲げられている目標 READMEでは、ツリーシェイカブルで小さなバンドルサイズと、最適化されたバニラJavaScriptに近いパフォーマンスを主張しており、JS Framework Benchmarkやバンドルサイズの比較を参照しています。シンプルさ、構成可能性、隠れたルールの少なさを強調し、宣言的なコードと読み書きの分離を推奨しています。また、抽象化が最小限であるため、D3などのネイティブJavaScriptライブラリを直接使用できることも指摘しています。 コミュニティとサポート サポート対象は、デスクトップおよびモバイルにおける最新2年間のFirefox、Safari、Chrome、Edgeです。サーバー側ではNode LTS、最近のDenoおよびCloudflare Workerランタイムを対象としています。IEおよび同様のサポート終了済みブラウザは明示的にサポートされていません。テストはSauceLabsによって支援されています。プロジェクトは、DiscordやRedditのコミュニティ、コントリビューターベース、Open Collectiveの資金調達ページ、そして成長を続けるコミュニティプリミティブ、コンポーネントライブラリ、ビルドタイムユーティリティのエコシステムを維持しています。