Digital Transformation
Partial Prerendering (PPR)
Partial Prerendering adalah strategi rendering hibrida di Next.js yang menyajikan shell halaman statis secara instan sambil men-stream bagian dinamis, sehingga halaman terasa cepat tanpa kehilangan personalisasi.
TL;DR: Partial Prerendering (PPR) adalah model rendering Next.js yang menggabungkan static shell dengan dynamic streaming dalam satu request, sehingga LCP rendah seperti SSG tetapi konten personal tetap segar. Per April 2026, fitur ini stabil di Next.js 15 dan menjadi default rekomendasi untuk halaman produk e-commerce.
Apa itu Partial Prerendering?
Partial Prerendering adalah strategi rendering yang men-precompute HTML statis untuk bagian halaman yang sama bagi semua pengguna (header, kategori, footer) lalu men-stream bagian dinamis (harga, stok, rekomendasi) saat request masuk. Model ini menghapus dilema lama antara SSG cepat tapi statis vs SSR personal tapi lambat.
Berbeda dengan ISR yang me-revalidate seluruh halaman, PPR memisahkan boundary statis dan dinamis di level komponen menggunakan <Suspense>. Static shell dikirim instan dari edge cache, dynamic hole di-render server saat dibutuhkan. Lihat dokumentasi resmi Next.js tentang Partial Prerendering untuk implementasi.
Cara Kerja vs Strategi Lain
| Strategi | Static Shell | Dynamic Hole | LCP Khas |
|---|---|---|---|
| SSG | Ya | Tidak ada | Sangat rendah |
| SSR | Tidak | Seluruh halaman | 1-3 detik |
| ISR | Ya (cached) | Tidak ada | Rendah |
| PPR | Ya | Sebagian streaming | Sangat rendah |
Kenapa Penting?
Untuk website bisnis yang butuh konten personal (harga regional, stok, login state) tetapi tetap mau LCP cepat, PPR memberi kompromi paling sehat. Pada beberapa proyek e-commerce yang menggunakan Next.js 15, migrasi dari full SSR ke PPR memangkas TTFB dari 600 ms ke sekitar 80 ms karena shell di-serve dari edge, sementara dynamic hole untuk harga dan stok di-stream paralel.
Pertanyaan Umum
Apakah PPR menggantikan ISR?
Tidak. ISR masih relevan untuk halaman yang tidak butuh personalisasi per request, seperti artikel blog atau halaman tentang. PPR cocok ketika satu halaman punya bagian static dan dynamic yang jelas bisa dipisah.
Apakah PPR mempengaruhi SEO?
Tidak negatif. Static shell yang dikirim instan justru membantu Googlebot membaca konten utama lebih cepat. Pastikan konten penting untuk SEO ada di shell, bukan di dynamic hole.