コンテンツにスキップ

SolidJS

出典: フリー百科事典『ウィキペディア(Wikipedia)』
SolidJS
作者 Ryan Carniato
リポジトリ https://github.com/solidjs/solid
プログラミング
言語
JavaScript
ライセンス MIT
公式サイト https://www.solidjs.com/
テンプレートを表示

SolidJS とは、ウェブサイト上で ユーザーインターフェースを構築するためのフリーかつ オープンソースライブラリである。[1]

概要

[編集]

SolidJSReactKnockout に影響を受けたライブラリであり、[2][1]開発者はこれを用いてユーザーインターフェースを構築することができる。宣言型 UI を利用でき、また 仮想 DOM を使用しない。[3]

特徴

[編集]

Signals

[編集]

SolidJS では、状態の管理に Signals を使用する。[4]これにより、状態へリアクティブに参照することができる。[5]また、副作用の定義において React のように依存関係を明示的に渡す必要がない。[6]

React と同様に、 JSX を用いることができる。[7][6]

仮想 DOM の不使用

[編集]

SolidJS は、仮想 DOM を使用していない。[2][8][9][10] Signal と組み合わせることで、効率なの DOM の置き換えを実現している。[10]また、React より DOM の変更のパフォーマンスが良いとされる。[11][12]

影響

[編集]

R.js は、SolidJS のリアクティブシステムに大きな影響を与えている。[13] また、React も単方向フローや、Hooks API の観点で SolidJS に影響を与えた。[13]

参考文献

[編集]
  1. ^ a b SolidJS”. www.solidjs.com. 2024年9月12日閲覧。
  2. ^ a b 次世代のReact? Solid.jsについて”. Zenn (2022年4月5日). 2024年9月12日閲覧。
  3. ^ 2024年はSolid.jsを使いませんか?【部内PaaS基盤 NeoShowcase フロント開発ログ】”. 東京工業大学デジタル創作同好会traP (2023年12月23日). 2024年9月12日閲覧。
  4. ^ 脱 React, Solid.jsを初めてみた”. Zenn. 2024年9月12日閲覧。
  5. ^ useSignal ~SolidJSやqwik等で話題のSignalsについて深掘りしてみる~ | 株式会社ロジカルスタジオ” (英語). www.wantedly.com. 2024年9月12日閲覧。
  6. ^ a b SolidJSが使いやすい”. Zenn. 2024年9月12日閲覧。
  7. ^ 【TypeScript】SolidJSで高速で軽量なWEBサイトを作る方法”. Zenn (2022年10月9日). 2024年9月12日閲覧。
  8. ^ SolidJSのパフォーマンスの秘密に迫ってみた”. Qiita (2022年12月17日). 2024年9月12日閲覧。
  9. ^ user (2024年4月8日). “フレームワーク「Svelte」「Solid」が話題。画期的だった仮想DOMと脱仮想DOMへの流れ”. レバテックラボ(レバテックLAB). 2024年9月12日閲覧。
  10. ^ a b SolidJS for beginners: a story of virtual DOM and signals | Theodo” (英語). blog.theodo.com (2023年7月28日). 2024年9月12日閲覧。
  11. ^ Popularity is not Efficiency: Solid.js vs React.js” (英語). DEV Community (2024年1月1日). 2024年9月12日閲覧。
  12. ^ cohamucohamu (2024年5月14日). “SolidJSとReactの徹底比較:パフォーマンス、学習のしやすさ、人気度から選ぶべきフレームワークは?”. コハム. 2024年9月12日閲覧。
  13. ^ a b SolidJS”. www.solidjs.com. 2024年9月12日閲覧。

外部リンク

[編集]