Digital Transformation
ISR (Incremental Static Regeneration)
Fitur Next.js yang regenerate halaman statis di background setelah jangka waktu tertentu, gabungan kecepatan SSG dengan freshness SSR.
TL;DR: ISR (Incremental Static Regeneration) adalah fitur Next.js yang memungkinkan halaman statis (SSG) di-regenerate ulang di background setelah jangka waktu tertentu, tanpa rebuild seluruh site. Hasilnya: kecepatan static site dengan kesegaran konten dinamis. Cocok untuk blog, dokumentasi, dan e-commerce dengan ribuan halaman.
Apa itu ISR?
ISR diperkenalkan Next.js pada versi 9.5 (2020) dan menjadi salah satu fitur signature framework ini. Mekanismenya: halaman pertama-tama digenerate sebagai static HTML saat build. Setelah revalidate window (misal 60 detik) terlewati, request berikutnya akan men-trigger background regeneration. User tetap dapat halaman cache lama (instan), sementara halaman baru disiapkan untuk request berikutnya.
Dalam praktik Next.js App Router (Next.js 15), ISR dikonfigurasi via export const revalidate = 60 di route file. Lebih granular lagi pakai revalidateTag atau revalidatePath untuk on-demand revalidation, yang men-trigger update tanpa harus menunggu interval. ISR bekerja erat dengan cache invalidation dan strategi caching modern.
Kapan Pakai ISR?
| Skenario | Cocok ISR? |
|---|---|
| Blog dengan 500+ post yang jarang berubah | Sangat cocok |
| E-commerce dengan stok update tiap menit | Tidak, pakai SSR |
| Dashboard real-time user | Tidak, pakai CSR/SSR |
| Landing page dengan testimonial yang diupdate mingguan | Cocok |
| Daftar harga yang berubah bulanan | Cocok dengan on-demand revalidation |
Kenapa Penting?
ISR menyelesaikan dilema klasik web: kecepatan vs kesegaran. Sebelum ISR, developer harus pilih: SSG cepat tapi rebuild lama, atau SSR fleksibel tapi lebih lambat. ISR memungkinkan situs dengan 10.000+ halaman tetap loading di bawah 200 ms dari edge network, dengan konten yang ter-update otomatis. Berdasarkan dokumentasi Vercel, situs e-commerce besar yang adopsi ISR melaporkan penurunan build time dari 30 menit menjadi 2 menit.
Pertanyaan Umum
ISR sama dengan SSG?
Tidak. SSG generate semua halaman saat build. ISR generate awalnya saat build atau saat first request (lazy), lalu regenerate di background sesuai interval.
Apakah ISR bekerja di semua hosting?
ISR optimal di Vercel (vendor Next.js). Di hosting lain seperti Netlify atau self-host, butuh konfigurasi tambahan dan fitur on-demand revalidation tidak selalu 1:1.