JavaScript SEO Website Bisnis Indonesia: Strategi Render Next.js yang Dipercaya Google dan AI Search di 2026

TL;DR: Website bisnis berbasis React, Vue, atau Next.js sering kehilangan trafik organik karena strategi rendering yang salah. Praktik aman, gunakan static generation untuk konten publik, server-side rendering untuk halaman dinamis, dan client-side rendering hanya untuk dashboard internal. Strategi yang tepat memangkas waktu indexing 7-14 hari dan menjaga Web Vitals tetap sehat.

Dalam beberapa proyek website bisnis terakhir yang saya tangani, hampir setengahnya datang dengan masalah indexing. Halaman ada di sitemap, sudah disubmit ke Google Search Console, tapi tidak muncul di pencarian. Penyebabnya hampir selalu sama, framework JavaScript yang merender konten di sisi klien tanpa fallback HTML yang bisa dibaca crawler.

Per April 2026, Googlebot memang sudah lebih cerdas merender JavaScript modern. Tapi efisiensi crawl tetap penting, terutama untuk website bisnis dengan ratusan halaman produk atau artikel. Strategi rendering yang salah artinya budget crawl Google terbuang pada rendering, bukan pada cakupan konten.

Mengapa JavaScript SEO Bukan Lagi Pilihan, Tapi Keharusan

Mesin pencari modern, dan AI Search seperti Google AI Overview maupun Perplexity, mengambil HTML pertama kali. Jika konten utama hanya muncul setelah JavaScript dieksekusi, ada delay rendering yang bisa berlangsung 7-14 hari pada kondisi normal, atau bahkan lebih lama untuk situs baru. Untuk konteks lebih dalam tentang bagaimana JavaScript SEO bekerja, lihat halaman terkait.

Ada juga implikasi performa. Bundel JavaScript besar memperburuk dua dari tiga metrik Core Web Vitals, yaitu LCP dan INP. Jika halaman butuh 3 detik untuk render konten utama, bukan hanya pengguna yang frustrasi, tapi juga sinyal Web Vitals ke Google.

Strategi Render yang Cocok untuk Tiap Jenis Halaman

Untuk Next.js, pilihan rendering bukan hitam-putih. Setiap halaman bisa pakai strategi berbeda. Berikut tabel yang saya pakai sebagai panduan saat scoping proyek client.

Stack yang saya rekomendasikan untuk website bisnis Indonesia tahun ini adalah Next.js 15 App Router, dengan kombinasi SSG untuk halaman publik dan ISR 60-300 detik untuk halaman katalog. Untuk performa lebih jauh, code splitting memastikan setiap halaman hanya memuat JavaScript yang benar-benar dipakai.

Studi Kasus: Migrasi Vetmo dari CRA ke Next.js

Saat membantu Vetmo (klinik hewan) memindahkan website dari Create React App ke Next.js App Router awal 2025, halaman edukasi mereka tidak terindeks dengan baik karena murni CSR. Setelah migrasi ke SSG dengan ISR 5 menit, dalam 8 minggu posisi rata-rata kueri "vaksin kucing" naik dari halaman 3 ke halaman 1, dan trafik organik bulanan tumbuh sekitar 70%.

Migrasi ini juga memangkas LCP dari rata-rata 4,2 detik menjadi 1,8 detik di koneksi 4G Indonesia, dan TTFB dari 1,1 detik ke 280 ms karena halaman dilayani langsung dari edge cache Vercel. Dokumentasi resmi tentang strategi rendering Next.js bisa dipakai sebagai referensi tambahan.

Validasi Apakah Halaman Anda Sudah Render dengan Benar

Sebelum claim sebuah halaman SEO-friendly, validasi tiga hal berikut. Pertama, buka Google Search Console, fitur URL Inspection, lihat tab "Tested page". Apakah konten utama muncul di HTML yang dirender Googlebot? Kedua, lihat lewat curl atau view-source di browser, apakah konten ada di HTML awal sebelum JavaScript dieksekusi? Ketiga, jalankan PageSpeed Insights, periksa apakah LCP di bawah 2,5 detik dan INP di bawah 200 ms. Untuk konteks lebih luas tentang INP dan dampaknya pada Web Vitals, lihat halaman terkait.

Pertanyaan Umum

Apakah React tanpa Next.js bisa SEO-friendly?

Bisa, tapi butuh setup pre-rendering manual atau pakai library seperti React Helmet dan static export. Untuk website bisnis serius, framework yang sudah punya SSR/SSG built-in seperti Next.js atau Remix lebih praktis dan lebih reliable.

Apa beda SSG dan ISR untuk SEO?

SSG menghasilkan HTML saat build, jadi sangat cepat tapi tidak update sampai build berikutnya. ISR menghasilkan HTML saat build awal, tapi otomatis regenerate setelah waktu tertentu (misal 60 detik). Keduanya memberikan HTML utuh ke Googlebot, jadi sama baiknya untuk SEO.

Bagaimana jika website saya WordPress, apakah tetap perlu JavaScript SEO?

Umumnya tidak. WordPress merender HTML di server secara default. Yang perlu diperhatikan adalah jika Anda pakai theme yang heavy JavaScript di sisi klien, atau plugin yang inject konten lewat JS.

Apakah strategi ini berlaku juga untuk Vue dan Nuxt?

Ya. Nuxt punya konsep SSG, SSR, dan ISR yang setara dengan Next.js. Prinsip yang sama berlaku, kirim HTML pre-rendered ke crawler untuk konten yang ingin diindeks.

Pilih Strategi Render Sebelum Memilih Framework

Banyak developer dan marketer baru memilih framework berdasarkan tren atau familiaritas. Untuk website bisnis yang serius soal trafik organik, urutannya terbalik. Tentukan dulu mana halaman yang perlu diindeks, mana yang dinamis, mana yang internal saja. Setelah peta itu jelas, pilihan framework dan strategi rendering jadi konsekuensi logis. Untuk perspektif lebih lengkap tentang Web Vitals di koneksi 4G Indonesia, lihat artikel resource hints untuk Web Vitals website bisnis Indonesia.