Digital Transformation
SSR (Server-Side Rendering)
SSR adalah teknik membangun HTML halaman web di server setiap kali ada permintaan, sehingga konten yang dikirim ke browser sudah siap tampil dan terindeks mesin pencari.
TL;DR: SSR atau Server-Side Rendering adalah cara menghasilkan HTML halaman web di server pada setiap permintaan. Hasilnya, browser dan crawler menerima konten yang sudah jadi sehingga halaman lebih cepat tampil dan ramah SEO untuk konten yang sering berubah.
Apa itu SSR?
Server-Side Rendering (SSR) adalah pola arsitektur di mana server merakit HTML lengkap setiap kali pengguna meminta sebuah halaman. Berbeda dengan Client-Side Rendering yang merakit halaman di browser pengguna lewat JavaScript, SSR mengirimkan konten yang sudah jadi sehingga First Contentful Paint biasanya lebih cepat.
Analogi sederhananya, SSR seperti memesan makanan yang sudah disajikan di piring saat tiba di meja. Pelanggan tidak perlu memasak ulang. Sementara CSR seperti pelanggan mendapat bahan mentah dan harus memasak sendiri di tempat.
Cara Kerja Singkat
| Tahap | Yang Terjadi |
|---|---|
| 1. Request | Browser meminta URL ke server |
| 2. Render | Server mengambil data, merakit HTML |
| 3. Respond | Server mengirim HTML jadi ke browser |
| 4. Hydrate | JavaScript di browser memasang interaktivitas |
Kapan SSR Cocok Dipakai?
SSR cocok untuk halaman yang datanya sering berubah dan harus akurat per request, misalnya dashboard yang sensitif terhadap sesi pengguna, hasil pencarian, atau halaman e-commerce dengan stok dinamis. Untuk konten yang stabil seperti halaman tentang atau blog, SSG atau ISR seringkali lebih hemat biaya server.
Kenapa Penting?
SSR membantu sinyal SEO untuk halaman dengan konten kontekstual karena crawler menerima HTML lengkap tanpa harus mengeksekusi JavaScript. Dampak ini terasa pada situs Indonesia dengan rasio pengunjung mobile tinggi dan kualitas jaringan bervariasi. Praktik di lapangan menunjukkan SSR membantu menjaga Core Web Vitals di angka aman saat halaman berisi banyak data dinamis.
Pertanyaan Umum
Apa beda SSR dan SSG?
SSR merakit HTML setiap permintaan, sementara SSG merakit HTML sekali saat build dan menyajikan file statis. SSG lebih cepat dan murah, SSR lebih segar.
Apakah SSR memperlambat website?
SSR bisa memperlambat jika server lambat atau data backend tidak optimal. Dengan caching layer dan database yang sehat, SSR tetap memberi waktu respon kompetitif.
Apakah SSR wajib untuk SEO?
Tidak. SSG dan Hydration yang baik juga ramah SEO. SSR baru penting saat konten berubah cepat dan crawler tidak boleh menerima halaman kosong.
Istilah Terkait