ISRは「SSRの重さ」と「SSGの古さ」を同時に解決した
Incremental Static Regeneration(ISR)は、SSRの代替でもSSGの強化版でもありません。
「毎回レンダリングすると重い」「事前生成すると更新できない」という、Webアプリが長年抱えていた2つの問題を同時に解決するために生まれた仕組みです。
一言で言えば、ISRは「必要になったページだけを、アクセスされたタイミングで静的HTMLに変換し、以降はキャッシュとして配る」技術です。
これにより、
- SSRのサーバ負荷
- SSGの更新遅延
の両方が大幅に改善されます。
従来のSSRの問題
SSR(Server Side Rendering)は、アクセスのたびにHTMLを生成します。
リクエストの流れはこうです。
| 手順 | 処理 |
| 1 | ユーザーがアクセス |
| 2 | サーバがDB/APIからデータ取得 |
| 3 | HTML生成 |
| 4 | レスポンス送信 |
つまり、ユーザー数が増えるほどサーバCPU使用率が上昇します。
特にECサイトやニュースサイトでは、人気ページにアクセスが集中し、ボトルネックになります。
実際に起きる現象
- トラフィック増加時にレスポンスが遅くなる
- オートスケールでインスタンスが増える
- インフラ費用が跳ね上がる
SSRはSEOやOGPに強い一方で、「成功するとコストが上がる」性質があります。
SSGの問題
次にSSG(Static Site Generation)です。
SSGはビルド時にHTMLを生成しておき、配信はCDNから行います。
これは非常に高速です。
しかし別の問題があります。
それは「更新」です。
例えば商品ページが10万件ある場合、価格変更1件でも全ビルドが必要になります。
| 問題 | 内容 |
| 更新遅延 | 反映まで時間がかかる |
| ビルド時間 | 数十分〜数時間 |
| デプロイ負荷 | CIが詰まる |
ニュースサイトやECでは致命的です。
ISRの仕組み
ISRはこの2つの中間に位置します。
export async function getStaticProps() { const data = await fetchAPI() return { props: { data }, revalidate: 60 } }
この「revalidate」が核心です。
動作は次のようになります。
| アクセス | 動作 |
| 初回アクセス | SSR的にHTML生成 |
| 2回目以降 | 生成済みHTMLを配信 |
| 指定秒数後のアクセス | 裏で再生成 |
つまりユーザーは常に高速な静的ページを受け取りながら、裏側では更新が進行します。
重要なポイント
ISRは「更新時にユーザーを待たせない」設計です。
最初のユーザーは古いページを見ることがありますが、そのアクセスがトリガーとなり新しいHTMLが生成されます。
この非同期更新が、SSRとSSGの差を埋めています。
なぜこれが重要なのか
ISRの本質はパフォーマンスではなくスケーラビリティです。
例えば次のケースです。
- 商品数:50万件
- 1日更新:1万件
SSGではビルドが現実的ではありません。
SSRでは負荷が高すぎます。
ISRでは「アクセスされたページだけ更新」されます。
つまり、存在するページすべてを処理する必要がありません。
これが大規模サイトで採用される理由です。
CDNとの関係
ISRはCDNと非常に相性が良いです。
| 方式 | 配信 |
| SSR | アプリケーションサーバ |
| SSG | CDN |
| ISR | CDN + 再生成 |
生成後のHTMLはキャッシュされ、エッジから配信されます。
結果としてTTFBが大きく改善します。
注意点
ISRは万能ではありません。
即時更新が必要なページ
- 在庫数
- ログイン情報
- 個別ユーザー情報
これらはISRに向きません。
再生成のタイミングに依存するため、リアルタイム性が保証されません。
キャッシュの誤解
ISRは「キャッシュ」ではなく「再生成スケジューラ」です。
revalidateの秒数は「有効期限」ではなく「再生成可能になる時間」です。
この誤解で不具合になるケースが多いです。
実務での使い分け
| ページ | 方式 |
| 記事ページ | ISR |
| 商品詳細 | ISR |
| 管理画面 | SPA |
| マイページ | SSRまたはCSR |
1つの方式に統一しないことが重要です。
まとめ
ISRは単なる高速化技術ではありません。
「更新と配信を分離したレンダリング方式」です。
SSRは正確だが重い、SSGは速いが古い。
ISRは「だいたい最新で、常に速い」という現実的な折衷案です。
ページは常に完成している必要はありません。
ユーザーが見る瞬間に成立していればよい、という考え方が、ISRの本質です。