Fastify DX というフルスタックなフレームワークは伸びるか?

2022/06/07に公開

Fastify DX という、Node.js 製のフルスタックなフレームワークが発表されています。開発者は Jonas Galvez さんで、NearForm という Fastify の開発をスポンサーしている企業の方です。 同じく NearForm で働いている Fastify の作者として有名な Matteo Collina さんと一緒によく Twitter などで見かけます。

https://twitter.com/anothergalvez

本記事では Fastify の概要と、この Fastify DX というフレームワークにをざっと見てみた感想を記述します。

リポジトリはこちら:

https://github.com/fastify/fastify-dx

Fastify について

Fastify DX の前に Fastify について説明します。Fastify は Node.js 最速の Web フレームワークで、 Express.js や Koa.js の開発が落ち着いているのとは対象的に、現在も活発に開発されています。 TypeScript で書かれてはいませんが、型定義などはほぼ全てのパッケージで丁寧に記述されており、TypeScript で書く上で困ることはありません。

Fastify は、もともと Matteo さんがコンサルをしていた時のクライアントに、ある Express 製のアプリケーションを速くしてくれと頼まれたのがきっかけで産まれました。最初は Logger の改善から始めたらしいですが、調べていくと Web フレームワーク自体を速くする必要があったため、 Fastify を作るに至ったらしいですね。その誕生エピソードもさることながら、現在に至るまで Fastify はオープンなコミュニティが形成されており、プルリクへの反応も早いですし、新しい機能などもテストさえ書いていれば積極的に取り入れていく傾向にあります。また周辺のエコシステムも活発で、 GraphQL のフレームワークである Mercurius や WebSocket 拡張の fastify-ws 、各種 View ライブラリとの統合である point-of-view など、だいたい Express でやっていたことは Fastify で実現できるので、もう Express を使うことはなくなってきたのではないでしょうか。私も2018年くらいから Express を使うのをやめて、以降新規プロジェクトでは Fastify を使うようにしています。

Fastify DX

そんな Fastify のコア開発チームから、 Fastify DX なる新規プロジェクトが立ち上がっています。

https://github.com/fastify/fastify-dx/tree/main/packages/fastify-dx-react

Fastify DX is an upcoming full stack framework built on top of Fastify and Vite.

とあるように、 Fastify DX は Vite を全面的に利用することで、爆速な開発体験を提供できているようです。もともと fastify-vite というものは別で作られていたが、 Fastify DX に吸収されていったようですね。

そして今日 (2022年6月7日)、 Fastify DX for React の 0.0.1 がリリースされました。

https://twitter.com/anothergalvez/status/1534067305524641792

2022年6月7日時点ではまだ Alpha 版なので、そこから読み取れることをベース記述します。全部読んだわけではないので、違ったらすみません。

ぱっと見る限り Next.js や Remix などと同じく、ファイルシステムをベースとしたルーティングを提供するようです。が、 Fastify を起点しているため、 JAM Stack を基本でサーバーはおまけ程度である Next.js などとは違い、本格的なサーバーサイドを作り込むことを前提としたフレームワークになるのではないかと私は考えています。

面白いのは Universal Route Module API (URMA) というものが策定されており、 Fastify DX の基本となる考え方のようです。その中で Streaming Mode というものがあり、こちらはサーバーサイドの結果を一度に返すのではなく、 StreamSuspense を使って連続的に読み込むという仕様のようです。これは Next.js の getServerSideProps などとは対象的で、初回のレンダリングが終わった後も継続的に Prop を受け続けるというは便利になりうるなあと思いました。ただ実装はかなり複雑になりそうなので、フレームワークとしてどこまでシンプルさを保てるかは今後にかかってくるかなという気がしました。

https://github.com/fastify/fastify-dx/blob/main/starters/react/client/pages/streaming.jsx

また、複数のフロントエンドのフレームワークをサポートしようとしているようです。現時点で React, Vue, Svelte, Solid をサポートする予定のようです(少なくともディレクトリがある)。これはかなりハードルが高いように感じますが、どうなんでしょうか。最終的に React だけに落ち着くような気もします。

他にも色々と実装予定の機能が紹介されていますが、地味に便利そうだなと思ったのが SSR と CSR を完全に分離することができるようです。 下記のように記述すると、一切サーバーサイドでは読み込まれないページができるようです。 Next.js で確実に CSR だけにしたいタイミングはちょいちょいあるので、これは良さそうな気がしました。

export const clientOnly = true

その他に関しては、この辺を読むと良さそうです。

https://github.com/fastify/fastify-dx/blob/main/URMA.md

まとめ

「伸びるか?」という点に関しては、まあ今後の開発次第かなという気はします。ただフルスタックの宿命として、 Next.js などはフロントエンドのみで採用できるのに比べて、 Fastify DX はサーバーサイドも Fastify に限定されてしまうので、バックエンドは Go で書きたいみたいな場合に困りそうですね。 BFF として Fastify を使うのは有りかもですが、それだったら Next.js で良いような気がします。 Streaming Mode や統合されたルーティングなど、便利そうな機能は多数実装されそうな予感はするものの、現時点で既存の知識を捨ててまで使いたいかと言われると微妙な気はしました。

またドキュメントの問題かもしれませんが、全体的にとっつきにくい感じがしました。現状のままだと、学習コストが Next.js よりは格段に上がるイメージです。

ただ個人的に Fastify と Mercurius にはいつもお世話になっているので、今後も Fastify エコシステムが発展していくことを願っています。

Discussion