Pemroses peristiwa sentuh dan roda berguna untuk melacak interaksi pengguna dan membuat pengalaman scroll kustom, tetapi juga dapat menunda scroll halaman. Saat ini, browser tidak bisa mengetahui apakah pemroses peristiwa akan mencegah pengguliran, sehingga selalu menunggu pemroses selesai dieksekusi sebelum men-scroll halaman. Pemroses peristiwa pasif memecahkan masalah ini dengan mengizinkan Anda menunjukkan bahwa pemroses peristiwa tidak akan pernah mencegah pengguliran.
Kompatibilitas browser
Sebagian besar browser mendukung pemroses peristiwa pasif. Lihat Kompatibilitas browser
Cara audit pemroses peristiwa pasif Lighthouse gagal
Mercusuar menandai pemroses peristiwa yang mungkin menunda scroll halaman:
Lighthouse menggunakan proses berikut untuk mengidentifikasi pemroses peristiwa yang mungkin memengaruhi performa scroll:
- Mengumpulkan semua pemroses peristiwa di halaman.
- Memfilter pemroses non-sentuh dan non-roda.
- Memfilter pemroses yang memanggil
preventDefault(). - Memfilter pemroses yang berasal dari host yang berbeda dengan halaman.
Lighthouse memfilter pemroses dari host yang berbeda karena Anda mungkin tidak memiliki kendali atas skrip ini. Mungkin ada skrip pihak ketiga yang membahayakan performa scroll halaman, tetapi skrip ini tidak tercantum dalam laporan Lighthouse Anda.
Cara membuat pemroses peristiwa menjadi pasif untuk meningkatkan performa scroll
Tambahkan flag passive ke setiap pemroses peristiwa yang diidentifikasi Lighthouse.
Jika Anda hanya mendukung browser yang memiliki dukungan pemroses peristiwa pasif, cukup tambahkan penandanya. Contoh:
document.addEventListener('touchstart', onTouchStart, {passive: true});
Jika Anda mendukung browser lama yang tidak mendukung pemroses peristiwa pasif, Anda harus menggunakan deteksi fitur atau polyfill. Lihat bagian Deteksi Fitur dalam dokumen penjelasan Pemroses peristiwa pasif WICG untuk mengetahui informasi selengkapnya.