Digital Transformation
Soft Navigation
Soft Navigation adalah perpindahan halaman tanpa full reload, biasanya di SPA atau aplikasi Next.js dengan App Router yang memakai routing client-side untuk pengalaman instan.
TL;DR: Soft Navigation adalah perpindahan halaman di web yang tidak memicu full reload browser. Umum di Single Page Application dan Next.js App Router. Sejak 2024, Chrome mulai melaporkan Web Vitals soft navigation di CrUX Data sehingga menjadi sinyal performa baru yang relevan untuk SEO.
Apa itu Soft Navigation?
Soft Navigation terjadi ketika user berpindah halaman tetapi browser hanya meng-update sebagian DOM tanpa request HTML penuh ke server. Framework seperti Next.js, Remix, dan SvelteKit menggunakan teknik ini agar transisi terasa instan. Berbeda dengan hard navigation yang memuat ulang seluruh dokumen, soft navigation menjaga state aplikasi tetap hidup.
Konsekuensinya, metrik seperti LCP dan INP perlu diukur ulang per soft navigation, bukan hanya saat first load.
Cara Browser Mendeteksi Soft Navigation
Chrome menggunakan heuristik berdasarkan kombinasi sinyal: perubahan URL via History API, modifikasi DOM signifikan dalam waktu singkat, dan adanya event interaksi user yang memicunya. API PerformanceObserver dengan type: 'soft-navigation' mulai tersedia di Chrome 117+.
| Aspek | Hard Navigation | Soft Navigation |
|---|---|---|
| Reload browser | Ya | Tidak |
| State aplikasi | Hilang | Tetap |
| LCP diukur ulang | Ya | Ya (sejak Chrome 117) |
| Beban server | HTML penuh | Data saja (RSC/JSON) |
Kenapa Penting?
Untuk marketer, soft navigation menentukan apakah pageview kedua dan seterusnya terasa cepat. Banyak website Next.js terlihat lambat di first load tapi sangat cepat di navigasi berikutnya. Tanpa pengukuran soft navigation, real user monitoring hanya menangkap separuh cerita.
Untuk developer Next.js di Indonesia, soft navigation default di App Router. Pastikan komponen berat di-lazy load dan data fetching pakai parallel routes agar transisi tidak nge-block render.
Pertanyaan Umum
Apakah soft navigation mempengaruhi SEO?
Tidak langsung pada ranking, tapi mempengaruhi metrik Core Web Vitals yang menjadi sinyal ranking. Pastikan soft navigation tetap update title dan meta tags via document.title.
Bagaimana mengukur soft navigation di GA4?
GA4 otomatis mendeteksi soft navigation jika aktifkan Enhanced Measurement dengan event page_view berbasis History API.
Istilah Terkait