はじめに

今まで、ReactやVueやAngularなどのフロントエンドFWを色々使ってきましたが、最近話題のSolidJSを勉強がてら触ってみようかと思います。

作ったもの

SolidJSを使って、Markdownを書けるEditorを作りました。

ReactやVue.jsと同様にコンポーネント指向のアプローチを採用し、仮想DOMを使用する代わりにテンプレートを実際のDOMノードにコンパイルすることで高速なリアルタイムレンダリングを実現するJavaScriptのUIライブラリです
TypeScriptをサポートし、拡張性や再利用性も高く、状態管理や副作用の処理が容易になるフックシステムを持っています
また、Svelteに似たイミュータブルなステート管理も可能です

基本的には、チュートリアルを一通り実施してからサンプルの作成を始めました。
そこでチュートリアルを実施してみて、感じたことを、少し共有していこうと思います。

条件付きレンダー
- v-ifやjsを絡ませることがなくなったので、シンプルに描けるようになリました
- Show コンポーネントで when と fallback を使うことで再現するようです
- 複数条件の場合は、Switch/Match を使える
繰り返し処理
- <For> タグを使用して、実現するが、Reactなどと書き味はあまり変わらなさそう

react にかなり近いと感じました
- 公式としても、特に React と Knockout という巨人の肩の上に立っています と発言しているので、やはり感覚は間違っていなさそうです
- Reactを使ったことある人は、導入は割と早いかもしれません
- tsx形式がそのまま使えるのも割とグッドです
vite も使える
- こちらは、最近のフロントエンドフレームワークならば、ほとんど対応していますが、とてもありがたいです。
- 個人的には、最近はWebpackではなくVite一択となってきているので、その記事も書いていきたいなと思っています
まだまだドキュメントが少ない
- 公式のチュートリアルは割と充実しているが、他のライブラリと組み合わせたりする際のに、実施した例があまりなかったです
- こちらは、今後増えることに期待しましょう
パフォーマンスの速さを実感できていない
- 「仮想DOMからの脱却をして、速度がかなり向上しました」とはあるものの、私が作った規模ではあまり感じることができませんでした
- というのも、複雑なUIやAPI呼び出しの部分さえないので、パフォーマンス面はいつか試してみようと思います

react にかなり近いせいもあるが、構文が要所要所異なるので、この違いに最初のうちは困惑しそう
- 慣れてくれば、かなり使いやすいフレームワークだとは感じました
ただ、ライブラリの対応状況が不明なことも多いので、本格的に開発に採用する際も、大きいプロジェクトではなく、小さいものから入るのが良さそうです
とは言いつつ、今後ユーザーが増えることに期待は大きいです
- まだメインで使うことはなさそうですが、機会があれば採用してみたいなとも思えるほど魅力的ではありました

最後にお知らせとなりますが、イーディーエーでは一緒に働くエンジニアを募集しております。
詳しくは採用情報ページをご確認ください。
https://eda-inc.jp/recruit/
みなさまからのご応募をお待ちしております。