Glossary menengah
Rendering
Yang dilihat Google bukan HTML yang dikirim server dan bukan pula tampilan di browser kita, melainkan hasil dari proses ketiga yang berjalan di antrean terpisah, bisa tertunda, dan bisa gagal diam-diam.
Rendering adalah proses menjalankan HTML, CSS, dan JavaScript sebuah halaman untuk menghasilkan DOM akhir yang dilihat pengguna. Googlebot merender halaman dengan Web Rendering Service berbasis Chromium versi terbaru (evergreen), dalam antrean yang terpisah dari crawling. Konten yang hanya muncul setelah JavaScript dijalankan baru terlihat Google setelah tahap ini.
Tiga tahap, dua antrean
- CrawlGooglebot mengambil HTML mentah. Link dan konten yang ada di HTML ini langsung bisa diproses.
- Antrean renderHalaman berstatus 200 tanpa noindex diantrekan. Google: "a few seconds, but it can take longer than that".
- RenderChromium menjalankan JavaScript, mengambil CSS/JS/API yang dibutuhkan (kecuali yang diblokir robots.txt), menghasilkan DOM akhir.
- IndexGoogle memproses DOM hasil render: konten, link, meta, structured data yang muncul setelah JavaScript ikut terbaca.
Yang bisa gagal
| Masalah | Akibat | Cara mengecek |
|---|---|---|
| CSS atau JS diblokir robots.txt | Halaman dirender tanpa gaya atau tanpa konten; Google bisa menilai halaman kosong | URL Inspection → More info → Page resources; robots.txt tester |
| JavaScript error | Render berhenti di tengah; konten setelah error hilang | URL Inspection → More info → JavaScript console messages |
| Konten bergantung pada API yang lambat atau menolak Googlebot | Timeout; bagian itu kosong | Bandingkan HTML hasil render dengan tampilan browser |
| Link tanpa href (onclick, router tanpa anchor) | Google tidak menemukan halaman tujuan | Cari <a href di HTML hasil render |
| Meta robots atau canonical diubah lewat JavaScript | Nilai HTML mentah dan hasil render berbeda; Google bisa membaca yang mana pun. Kalau HTML mentah berisi noindex, render dilewati | Pastikan nilainya sama di keduanya, atau hanya di HTML mentah |
| Konten hanya muncul setelah interaksi (klik, scroll) | Googlebot tidak mengklik dan tidak menggulir seperti manusia | Konten harus ada di DOM saat halaman selesai dimuat |
| Fragment URL (#/halaman) | Google mengabaikan fragment sebagai pembeda URL | Pakai History API dan URL sebenarnya |
| Cache header diabaikan WRS | Google mungkin memakai versi lama sumber daya | Pakai fingerprint di nama berkas (app.3f2a.js) saat berubah |
Server-side, client-side, dan yang di antaranya
| Pendekatan | Konten di HTML mentah? | Risiko render | Catatan |
|---|---|---|---|
| Statis / server-side rendering (SSR) | Ya | Rendah | Yang dipakai situs ini. Google membaca konten sebelum render |
| Hydration (SSR + JS interaktif) | Ya | Rendah | Konten ada; JS menambah interaksi |
| Pre-rendering / static generation | Ya | Rendah | HTML dibuat saat build |
| Client-side rendering (CSR/SPA murni) | Tidak | Tinggi | Semua bergantung pada antrean render; tiap kegagalan di atas berlaku |
| Dynamic rendering (versi khusus bot) | Ya untuk bot | Sedang | Google menyebutnya solusi sementara, bukan rekomendasi jangka panjang; dua versi harus setara |
Cara melihat apa yang Google render
- URL Inspection → Test live URL → View tested page. Tab HTML menampilkan DOM hasil render; tab Screenshot menampilkan tampilannya; More info menampilkan sumber daya yang gagal dan pesan konsol.
- Rich Results Test menampilkan HTML hasil render untuk URL apa pun tanpa perlu akses Search Console.
- Crawler desktop dengan mode JavaScript rendering (Screaming Frog, Sitebulb) untuk membandingkan HTML mentah dan hasil render di banyak URL sekaligus, termasuk kolom "link yang hanya ada setelah render".
Kalau konten utama ada di HTML mentah, semua ini jadi pemeriksaan rutin, bukan sumber kecemasan. Itu alasan paling kuat untuk server-side rendering pada situs yang bergantung pada pencarian.
Rujukan
- Understand JavaScript SEO basics Google Search Central
- Fix search-related JavaScript problems Google Search Central
- Dynamic rendering as a workaround Google Search Central