Next.js vs Gatsby
aiji42Gatsbyがまとめている記事なので、Gatsbyを贔屓している印象。。。
aiji42- Gatsby
- (基本的に)SSG
- (基本的に)GraphQL
- プラグイン充実
- テーマセットがある
- Next.js
- SSG/SSR
- BFFは何でもOK
- 基本的に自分でもろもろを構築する思想
aiji42「この点でこっちが優れているよ」とかあったら教えてほしいです！！
aiji42あるいはこういうコンテンツ、こんな開発チームなら、こちらがおすすめとかもあればぜひ！
catnose上に書かれている通り、ブログならGatsbyだと色々とプラグインが揃っているので、楽に構築ができます。ただ会員だけのページを作ったりと動的なコンテンツが出てくるような場合にはNext.jsの方が向いていると思います。
Next.jsだとVercelへのデプロイ体験はとても良いです。逆にVercel以外へデプロイするとなるとあまり情報が無かったりして苦労しそうな…
aiji42ありがとうございます！
Next.js の Vercel ありき感は慎重に見たいですね。
ここ数年で、Netlify・Vercel・Amplify... と乱立状態で、今後もホスティングサービスが増えてくるだろうなとおもっています。(もうしばらくすると、どこか一強状態で落ち着く気もしますが)
プライベートでならそこまで気にしないのですが、業務でとなるとベンダーロックインは極力避けたいなーという感じですね。
ただ、Vercel 以外でのホスティングを選択したとしても、Next.js の価値は十分にあるなあと思っています。
catnoseちなみに、上のQiitaの記事だと「画像の最適化はGatsbyの方がやりやすい」と書かれていますが、最近Next.jsでは画像の最適化用のコンポーネントがビルトインで導入されたので楽に最適化ができます。
（ただしVercelにデプロイするときに限る…？）
aiji42ありがとうございます！
Next.js は SSGに対応した v9. そして Image 最適化の施された v10 以降でがらりと形勢が変わりましたよね。
アップデートからまだそこまで時間がたってないのに伴ってドキュメントも少なく、Gatsby押しの記事の方が目につくので、そこはバイアスかけて公平に見てあげないとなと思っています。
catnoseGatsbyの方はブログ向けのテーマセットが充実しているということもあり、個人的には
- ブログをサクッと作るならGatsby
- 自分で細かいところまで調整したかったり、動的なコンテンツが含まれるような場合にはNext.js
という感じですね。
aiji42
- ブログをサクッと作るならGatsby
- 自分で細かいところまで調整したかったり、動的なコンテンツが含まれるような場合にはNext.js
この点に関しては、おおよそ認識と合っていたので良かったです！
aiji42
Next.js の incremental static regeneration (ISR) は、コンテンツ量が多く、ある程度の即時性が求められるプロダクトにおいては、大きな強みかなと思っています。
マシンリソースとコストは考慮に入れるべきだと思いますが。
追記
面白い試みを見つけました。実質ISRできるのは(現時点では) Vercel のみということですね。
また、
ところで、今回時間切れで検証できなかったことがある。それはISRの元となった考え方であるCache Controlにおけるstale-while-revalidateについてだ。
これは何かというとブラウザやCDNにおけるキャッシュにおいて、一定期間をキャッシュからレスポンスするが指定時間を経過したら非同期でオリジナルをfetchしてキャッシュをレスポンス/更新するというもの。つまりISRと同じものだ。
ということはこのCache ControlをサポートするCDNであれば実はNext.jsのISRを使わずとも同じことができるのではないかと思ったのだ。これができれば、Next.js側ではISRをせずとも通常のSSRでよくなるので、ISRと同じようなことをするにあたってホスティングする場所の選択肢が広がると思ったんだが。
ということなので、Stale-While-Revalidate に対応しているCDNを選択すれば、SSRでも同じことを実現可能ということですね。