ISRとは
ISR(Incremental Static Regeneration)は、Next.jsが提供する機能です。日本語では「増分静的再生成」と訳されますが、簡単に言えば「静的ページを作っておき、必要に応じて自動で更新する仕組み」です。
従来の方式との違い
Webページの生成方式には、いくつかの種類があります。
SSG(Static Site Generation)
ビルド時にすべてのページを静的HTMLとして生成します。表示は非常に高速ですが、コンテンツを更新するたびに再ビルドが必要です。商品数が多いECサイトでは、ビルド時間が長くなる課題があります。
SSR(Server Side Rendering)
ユーザーがアクセスするたびに、サーバーでHTMLを生成します。常に最新のデータを表示できますが、毎回サーバー処理が発生するため、表示までに待ち時間が生じます。
ISR
SSGとSSRの良いところを組み合わせた方式です。ビルド時に静的ページを生成し、設定した間隔(revalidate)で自動的に更新します。ユーザーには高速にキャッシュを返しつつ、バックグラウンドで最新データに更新できます。
ISRが適している場面
ISRは以下のようなケースで効果を発揮します。
- ECサイトの商品ページ: 在庫や価格は更新されるが、秒単位の即時性は不要
- ブログやニュース: 新着記事は随時追加されるが、公開後の変更は少ない
- 企業サイト: 情報は定期的に更新されるが、リアルタイム性は不要
逆に、チャットやリアルタイムの株価表示など、常に最新データが必要な場面には向いていません。
まとめ
ISRは「高速表示」と「データの鮮度」を両立させる仕組みです。ECサイトのように、ある程度の更新頻度があるコンテンツを、高速に配信したい場合に適しています。