Pengunjung sering menilai kecepatan website dari seberapa cepat halaman berikutnya muncul setelah tautan diketuk. Browser biasanya baru mulai mengambil dokumen tujuan setelah pengguna memilih tautan. Speculation Rules API memungkinkan situs memberi petunjuk agar browser menyiapkan navigasi yang kemungkinan terjadi lebih awal, sehingga perpindahan halaman berpotensi terasa lebih cepat.
Fitur ini bukan jaminan bahwa setiap halaman akan dimuat sebelumnya. Browser tetap mempertimbangkan dukungan, kebijakan privasi, ketersediaan sumber daya, serta aturan yang ditetapkan situs. Karena itu, penerapan yang baik dimulai dari alur pengguna yang jelas, bukan dengan memuat semua tautan sekaligus.
Apa Itu Speculation Rules API?
Speculation Rules API adalah mekanisme berbasis aturan yang memungkinkan situs menyatakan halaman mana yang layak dipersiapkan untuk navigasi berikutnya. Aturannya ditulis dalam format JSON melalui elemen script bertipe khusus di dokumen HTML. Browser membaca aturan tersebut lalu memutuskan apakah dan bagaimana spekulasi dilakukan sesuai dukungan serta kebijakan internalnya.
Istilah “spekulasi” penting di sini: browser menyiapkan kemungkinan navigasi, bukan menganggap pengguna pasti akan membuka halaman itu. Jika prediksi tidak terjadi, sebagian pekerjaan dapat terbuang. Implementasi perlu menyeimbangkan manfaat kecepatan dengan penggunaan jaringan, memori, dan CPU.
Prefetch dan Prerender: Apa Bedanya?
Prefetch mengambil dokumen tujuan lebih awal agar sebagian waktu tunggu jaringan dapat dikurangi saat pengguna benar-benar membuka tautan. Ini tidak berarti seluruh halaman sudah dirender dan siap ditampilkan.
Prerender melangkah lebih jauh dengan menyiapkan halaman dalam konteks tersembunyi yang dikelola browser. Jika pengguna kemudian membuka halaman tersebut dan aktivasi didukung, tampilan bisa muncul lebih cepat karena browser telah melakukan sebagian pekerjaan sebelumnya. Namun, prerender umumnya memakai lebih banyak memori, CPU, dan lalu lintas dibandingkan prefetch.
Pemilihan strategi harus sesuai konteks. Prefetch dapat menjadi awal yang lebih konservatif, sedangkan prerender sebaiknya digunakan secara selektif pada navigasi yang kemungkinan besar terjadi dan tidak menimbulkan efek samping yang tidak diinginkan.
Kapan Fitur Ini Berguna?
API ini layak dipertimbangkan untuk situs artikel dan dokumentasi ketika pembaca sering membuka halaman terkait, katalog saat pengunjung berpindah dari kategori ke detail produk, atau aplikasi berbasis konten dengan alur yang mudah diprediksi. Misalnya, halaman daftar dapat memberi petunjuk bahwa beberapa halaman detail yang sering dipilih merupakan kandidat navigasi berikutnya.
Hindari aturan agresif untuk seluruh tautan. Jangan sembarangan menyiapkan halaman yang mengubah data, memulai transaksi, atau melakukan tindakan yang seharusnya memerlukan persetujuan eksplisit. Halaman personal juga perlu ditinjau karena permintaan lebih awal dapat memengaruhi privasi, analitik, dan beban server.
Contoh Penerapan Dasar
Aturan berikut menggambarkan cara menyatakan bahwa halaman dengan pola URL tertentu dapat dipertimbangkan untuk prefetch. Ini contoh awal untuk diuji, bukan konfigurasi universal yang harus langsung dipasang di semua situs.
<script type="speculationrules">
{
"prefetch": [
{
"where": {
"href_matches": "/artikel/*"
},
"eagerness": "moderate"
}
]
}
</script>Pastikan pola URL sesuai struktur situs dan uji di browser yang mendukung fitur ini. Tingkat eagerness mengatur seberapa proaktif browser mempertimbangkan spekulasi; dukungan serta perilakunya dapat berbeda menurut browser dan versi. Jangan memasukkan halaman akun, logout, pembayaran, atau endpoint yang menjalankan tindakan hanya dengan permintaan GET.
Langkah Implementasi yang Aman
- Tentukan tujuan. Pilih alur navigasi yang sering dilakukan pengguna berdasarkan analitik, bukan sekadar menebak halaman mana yang menarik.
- Mulai dari cakupan kecil. Terapkan aturan pada beberapa halaman konten yang aman dan relatif ringan. Hindari pola yang cocok dengan hampir seluruh situs.
- Periksa kompatibilitas. Uji pada browser sasaran dan pastikan situs tetap berfungsi normal saat Speculation Rules API tidak tersedia. Fitur ini harus menjadi peningkatan progresif, bukan syarat agar navigasi bekerja.
- Jaga privasi dan cache. Pertimbangkan halaman yang memuat data personal, cookie, atau konten yang berubah cepat. Pastikan kebijakan cache dan kontrol akses server tetap benar.
- Ukur hasilnya. Bandingkan waktu navigasi, metrik pengalaman pengguna, konsumsi data, serta beban server sebelum dan sesudah penerapan. Uji juga pada koneksi seluler dan perangkat dengan sumber daya terbatas.
- Siapkan pemantauan. Periksa apakah permintaan tambahan meningkatkan beban atau mengganggu analitik. Sesuaikan aturan bila manfaatnya tidak terlihat atau biaya spekulasi terlalu tinggi.
Jangan Mengabaikan Optimasi Dasar
Speculation Rules API tidak menggantikan praktik performa web yang mendasar. Gambar berukuran tepat, JavaScript yang efisien, cache yang sesuai, kompresi, dan respons server yang cepat tetap penting. Jika halaman lambat karena skrip berat atau server lambat, prerender mungkin hanya menyamarkan sebagian waktu tunggu pada navigasi tertentu.
Selain itu, hasil pengukuran perlu dibaca dengan hati-hati. Navigasi yang telah disiapkan sebelumnya dapat terlihat lebih cepat, tetapi situs mungkin mengunduh lebih banyak data secara keseluruhan. Evaluasi pengalaman pengguna bersama konsumsi jaringan dan sumber daya agar peningkatan tidak hanya memindahkan biaya ke pengguna.
Kesimpulan
Speculation Rules API memberi pengembang cara deklaratif untuk membantu browser menyiapkan navigasi yang mungkin dilakukan berikutnya. Prefetch dapat mengurangi sebagian waktu tunggu jaringan, sedangkan prerender menyiapkan lebih banyak pekerjaan dengan biaya sumber daya yang lebih tinggi.
Mulailah dari alur yang dapat diprediksi, batasi halaman yang dispekulasikan, lindungi halaman sensitif, dan ukur dampaknya di kondisi nyata. Dengan pendekatan bertahap dan fallback yang tepat, fitur ini dapat menjadi salah satu alat untuk meningkatkan pengalaman navigasi tanpa mengorbankan keandalan atau privasi.
