Next.js 16.3 Instant Navigations: kontrak cache lebih penting daripada klik cepat
Apa yang terjadi
Next.js 16.3 Preview diumumkan pada 24 Juni 2026. Fitur utamanya adalah menampilkan shell route yang bisa dipakai ulang dengan cepat, lalu mengalirkan konten dinamis setelahnya.
Partial Prefetching mengurangi prefetch halaman penuh untuk setiap link dan lebih fokus pada shell per route.
Mengapa penting
Untuk dashboard dan SaaS, klik yang langsung menampilkan struktur halaman terasa jauh lebih cepat. Namun tim harus memisahkan UI shell, data request-time, Suspense, dan cache boundary dengan jelas.
Sinyal komunitas
Diskusi komunitas menunjukkan keinginan navigasi seperti SPA, tetapi juga kekhawatiran tentang stale data, search params, PPR, dan prefetch yang terlalu agresif.
Checklist
Pilih lima route utama, tentukan shell dan area dinamis, ukur transferred bytes, gunakan manual prefetch secara terbatas, beri nama cacheTag sesuai domain, dan cek invalidation CDN.
Instant Navigation checklist
• route shell vs dynamic region
• <Suspense> boundaries
• transferred bytes and RSC timing
• cacheTag / cacheLife ownership
• HTML and RSC CDN invalidation
Risiko
Karena masih Preview, mulai dari route read-heavy. Cache yang salah akan membuat data lama tampil lebih cepat, bukan lebih benar.
Sumber
- Next.js Blog: Next.js 16.3 Instant Navigations
- Next.js Docs: Prefetching
- Next.js Docs: Caching with Cache Components
- Next.js Docs: cacheComponents configuration
- Next.js Docs: Version 16 upgrade guide
- Next.js Docs: Rendering Philosophy
- Next.js Docs: CDN Caching
- Next.js Docs: PPR Platform Guide
- GitHub Discussion: Next.js searchParams and PPR cache concerns
- Reddit r/nextjs discussion: smooth App Router navigation expectations