Next.jsは世界で最も有名なReactフレームワークです。
主にSSR等ができるため、最近のWebフレームワークの中でも一番有名なものです。
ですが、Node.jsの持つ特性や、Next.jsのディレクトリ構造から、少し煩雑だったり、もっとシンプルにできる部分などもあります。
なので、今回はそんなNext.jsに飽きた人のために新しいフレームワークを紹介します。

Fresh

FreshはIsland ArchitectureをベースとしたWebフレームワークです。
Preactベースでとてもシンプルです。
また、Node.jsではなくDenoというランタイムをベースとしており、とてもモダンです。
(Denoでは、fetch() などのAPIが標準実装されているので、アプリを作るのがとても楽です。)

Island Architectureとは？

FreshはIsland Architectureをベースにしていると言いましたが、どういうアーキテクチャでしょうか。
Island ArchitectureはFreshの他にも、Astroなどでも使われています。
かんたんに言うと、ページ内で静的な部分と動的な部分(ボタンなど)を分けるアーキテクチャです。
何がいいかって言うと、パフォーマンスです。デフォルトでJavaScriptがロードされないので、その分ユーザー体験も素晴らしいものになります。
SPAかMPAかでいえば、MPAに当たりますね。
他の人の解説にもあるように、ルーティング体験(リンク移動)はSPAに比べたら悪いです。(そもそもDenoが速いので、そんなに変わりません)

ディレクトリ構成がいい

Node.jsと違ってnode_modules がないので、ディレクトリがスッキリしています。
また、サイズも少ないため、アップロードも速くなります。

TypeScript / TSXのサポート

Node.jsと違い、JSX・TSX・TypeScriptがDenoではデフォルトでサポートされているため、もちろんFreshでもサポートされます。
なので大規模な開発でももちろん利用が可能です。
セットアップも軽いので、開発体験抜群です。

Configurationが不要

設定ファイルも少なく、コンフィグが不要です。
とっても使いやすいですね。

ビルドステップ不要

SSRオンリーのフレームワークなので、ビルドステップも不要です。
そのままアップロードして、使うことができます。

おわりに

皆さんはNext.jsやNuxt.jsを使っていますか？
また、Node.jsを使っている人も多いと思います。
ですが、Freshは全く新しい選択として、今とてもぶち上がって来ています。
もうv1.0も出たので、大規模開発にも使えると考えます。
みなさんもFreshで、最高の開発体験をしてみましょう。
また、私のこのサイトもFreshで構築しています。
このMicroCMS & Freshのテックスタックはとても開発しやすいため、みなさんもやってみてください。
今回はとても短い記事になりましたが、できるだけ毎日投稿をしていくので、ぜひ皆さんこれからも読んでください。
中学生プログラマ、kstdxでした。