Tips DevTools: Melakukan debug navigasi spekulatif untuk pemuatan halaman yang lebih cepat

Sofia Emelianova
Sofia Emelianova

Dengan Speculation Rules API, Anda dapat menerapkan pemuatan halaman yang hampir seketika berdasarkan aturan spekulasi yang Anda tentukan. Tindakan ini memungkinkan situs Anda mengambil data dan melakukan pra-rendering sebagian besar halaman yang dibuka.

Tonton video dan lihat demo ini untuk mempelajari cara:

  • Periksa spekulasi, aturan, dan statusnya di Application > Background services > Speculative load.
  • Beralih antar-render melalui menu drop-down di panel tindakan di bagian atas dan periksa render menggunakan semua panel DevTools.
  • Status pra-render rekaman aktivitas live.

Bagaimana Anda bisa tahu di mana pengguna akan mengklik selanjutnya? Untuk membantu Anda memaksimalkan potensi pemuatan spekulatif, Chrome 121 kini dapat mengambil semua link dari dokumen, bukan daftar tetap, tetapi hanya melakukan pra-rendering saat pengguna mengarahkan kursor ke link dan akan mengkliknya.

Tonton bagian terakhir video untuk mempelajari cara menerapkan dan men-debug aturan dokumen yang memicu pra-rendering pada peristiwa pengarahan kursor atau mousedown. Peristiwa ini memberikan langkah awal untuk memuat halaman secara spekulatif sebelum navigasi. Lihat fitur ini di demo ini.

Untuk informasi selengkapnya, lihat: