Next.js
https://gyazo.com/e91abd63687c9ab29c5b9725efd64b9d
もともとSSR Server + Routingを提供していた
SPA/SSRのベストプラクティスを提供
https://pbs.twimg.com/media/GHTwnihWUAA5zCQ.jpg
爆速らしい
Web の最適化を考えることで、自分は Next.js を再び強く評価するようになった。
Core Web Vitalsの指標は、フロントエンドの改善に目がいきがちだが、ある程度やるとサーバーサイド込みで改善が必要で、その最適化をある程度以上すすめるには、現状 Next.js のようなクラサバまたがる最適化が必要、という認識を持った。 Next.js が実践しているフロントエンドのベストプラクティスは、乱暴に要約すると「いかに静的に確定する部分を増やして、それを CDN に置くか」
Next.js フルスタックが必要だ、と思ったのも、Core WebVitals のパフォーマンス改善でクライアント・サーバーを複合的に見れる人が少ない、という問題意識がある
Next.jsアプリケーションをビルドしてデプロイした後も、特定のページのみ定期的に再ビルドする機能です。
クライアントにキャッシュを返しつつ、裏でページ単位で再ビルドしてキャッシュを飛ばす
ISRの罠
Next.jsのISRは、revalidateが省略されたときrevalidateなしと解釈します。
つまり、上記のような状態でデプロイした場合、一度でも { notFound: true } が返ると以後そのURLではずっと404が返り続けるという恐ろしい状態になります。
その際、まず応急処置としてVercelの設定画面上でredeployをかけて誤ったキャッシュを飛ばし、その後速やかにrevalidateを設定して再デプロイするという対応を行いました。
〜Next.js 10.0.1
サーバを持つのが嫌だ
動的コンテンツもSSGができる(ブログとか)
クソデカ動的コンテンツ(UGC)はアクセス時にビルドする
Incremental Static Regeneration
NginXのリバースプロキシを使ってデプロイする方法
基本node.jsが必要だが、静的ページとして吐き出すこともできる(ほとんどすべての機能をサポートする)
If your app needs to generate dynamic pages at the runtime, you can't deploy it as a static app.
使ってるプロダクト