このブログはReact Router v7で書き換えたわけですが、他のFWやUIライブラリについても評価をしてみたいと思います。

UIライブラリ

React

覇権を握っているというだけで一定の価値があると思っています。

個人的にはJSX(tsx)の書き方が好きなだけであって、Reactが好きというわけではないようです。

後述の hono/jsx や solid-js のほうが好きです。

あとどこまでいっても結局 React 難しいなーってよく思います。

初心者の人に React 勧めるかというと、悩ましい。

Vue

ほとんど使ったことないんですが、Reactよりは初心者に勧めやすいのかなぁ。

先に Vue 触って、あとで React 触るとか、そういうのがいいのかもしれません。

案件もそれなりにあるのが React 同様評価ポイントです。

Svelte

個人的にはJSXが好きなので、率先しては使わないのですが、本当は初心者にオススメしたいNo.1かもしれない。

シンプルでわかりやすいし、Write less code言うてるだけあって、コード量が少ない。

自分は React 案件いくつかやってきたけど、やっぱそれなりな規模の案件に途中で参画すると、コードが読めねぇってことが多いです。

どうせとっ散らかるなら少ないコードでとっ散らかってくれた方がいいでしょうね。

初心者にオススメしたいNo.1なんだけど、結局案件数が少ないから、そこさえクリアすればって感じ。

Solid

個人的には一番好き。

React 書いてて面倒に感じる部分が改善されてるのがいいですね。

再レンダリングが～とか、useEffectの第二引数に依存配列を書くのが～とか、いちいちkeyを書くのが～とか、そういうのがないのがね。

問題は単純に案件数になります。やっぱここなんだよなぁ。

エコシステムの少なさもありますけど、最低限フォームのModular FormsもしくはTanStack Form、あとUIコンポーネントライブラリのPark UIがあるのでいけるとは思ってますけどねぇ。

FW

Astro

ゼロ JS のサイト作りなら120点。このブログも Astro で作るべき。

ただ実際の案件で使うかというと、生涯ずっとゼロ JS である保証がないので採用し辛いって感じですかね。

いやいや JS 使えるじゃん。React 使えるじゃん。って話なんですが、例えば

---
// src/pages/index.astro
import { About } from '@/components/React/About'
---
<About />

こんな雑なのがあったとして、

Aboutコンポーネントの中にハイドレーションしたい要素が出てきたとき、ピンポイントでハイドレーションできない、よね？（無知）

コンポーネント自身が Client Component なのか Server Component なのか指定できる仕組みだったら最強なんですけど。

Next.js

覇権を握っているというだけで一定の価値があると思っています。

が、とにかく罠が多い。難しい。大抵の案件でオーバースペックだと思います。

初心者にオススメしたくないですねぇ。バージョンによってキャッシュの挙動が違ったり、そもそもキャッシュの挙動を理解するのが難しい。

開発メンバー全員が Next.js 好きで、バージョン変更点を把握している、といった状況ならいいんじゃないかなと思います。もしくは個人開発。

Remix(React Router v7)

Next.jsよりは随分シンプルです。ほとんどのケースで Remix の方がいいんじゃないかなと思います。

とりあえず vite + React で SPA 作ろうかなってときでさえ Remix 使った方が色々楽だと思います。

気がかりはまだ RSC に対応しておらず、今後対応したときにどういう複雑な書き方をするのか、ということですかね。

HonoX

Hono 自体はもはや有名なので説明を省略して、HonoX は Hono + vite って感じです。

Hono がこれまで APIサーバーとして json を返していたところを、直接 HTML や JSX を返せるようになりました。

そんだけのことなんですが、Hono のシステムが優秀なので、そんだけでもかなり偉いです。

フロントコーディングのときに API 叩く関数に型書いて～とかやる必要がないです。

そんなこんなでこれからめちゃくちゃ期待大です。

hono/jsx に UIコンポーネントライブラリやフォームライブラリがあれば、もうそれでいいんじゃないかなと思います。

おわり

Nuxt とか SvelteKit とか Solid Start とか他にもありますけど、割愛。

まとめると、 個人的には Solid が好きだけど、そんな仕事はないのでしゃーなしで React 採用。

React の FW として、自分で選べるなら Remix といった感じです。

バックエンドまで面倒見るなら、Remix + Hono が一旦強い。

将来的に HonoX が完成して流行れば最強。

初心者に勧めるなら、短期的に見るなら Vue.js。 長期的に見るなら、一旦 Svelte からの React かなぁ。