最近のWebフレームワークとかが分からないのでまとめてみた

プログラミング

2022.10.30

わたすけです。低レイヤに興味がある人間なのになぜか代表作はWebサービスです。

ただ、このサービスはだいぶ長い間作っていて、技術スタックとしてはだいぶ落ちついているんですよね。React (Next) ＋TypeScriptでずっと作っています。ということはつまり、他のフレームワークを学ぶ機会がないということです。

しかし、Webの世界は猛スピードで進化しています。気付いたらRemixだのViteだの大量のフレームワークが話題になっています。他のフレームワークを学ぶ機会がないので、今挙げたRemixとかViteについて実はよくわかっていません。

ということで、自分がわかってないフレームワークとかライブラリとかそのあたりをまとめていこうかと思います。別にコードを交えて解説するわけでもないし、そもそも最近であるとも限らないのですが、ご了承ということでお願いします。

Remix

Reactベースのフレームワークらしい。多分Next.jsやGatsby.jsのような立ち位置？

SSGをしない。「Nested Routes」という機能があり、並列的な読み込み・部分的なコンポーネント記述ができる（ここらへんは公式サイトの比較映像が一番わかりやすい）。また、一つのコンポーネントにエラーが発生した時、ひとつひとつにエラーハンドリングを書けるらしい。

useTransitionというHookがあり、これでページ遷移についての情報をもらえるらしい。

フロントエンドフレームワーク。仮想DOMを使っていないらしい。また非常に少ないコードで記述できるのが特徴。

データフェッチングライブラリ。「stale-while-revalidate」から。開発元はNext.jsでおなじみVercel。

React Hooksで、シンプル・高速・軽量なデータフェッチを行うことが出来る。また、定期的なポーリング・ネットワーク回復時やページフォーカス（そのページを開いているブラウザにフォーカスしたり、タブを切り替えたり）時のデータ再検証など、色々やってくれそう。

ビルドツール。

開発時にバンドルをしないため、サーバーが速く立ち上がるらしい。さらに、HMR（Hot Module Replacement）でアプリサイズに関わらず高速に動作するらしい。

Vue.jsの人が開発。Reactのビルドも出来る。

これもビルドツール。Vercel製で、Next.js 13と一緒に発表された。Rustで書かれていて、Viteの10倍・Webpackの700倍速いらしい。ヤバそう。

他にも知らないものがあった気がするけど忘れました。