Lighthouse adalah alat audit situs otomatis yang membantu developer dengan peluang dan diagnostik untuk meningkatkan pengalaman pengguna situs mereka. Alat ini tersedia di Chrome DevTools, npm (sebagai modul Node dan CLI), atau sebagai ekstensi browser (di Chrome dan Firefox). Platform ini mendukung banyak layanan Google, termasuk web.dev/measure dan PageSpeed Insights.
Lighthouse 8.4 langsung tersedia di command line dan di Chrome Canary. Versi ini akan hadir di Chrome Stabil pada Chrome 95 dan akan tersedia di PageSpeed Insights dalam waktu seminggu.
Untuk mencoba Lighthouse Node CLI, gunakan perintah berikut:
npm install -g lighthouse
lighthouse https://www.example.com --view
Lihat daftar lengkap perubahan di log perubahan 8.4.
Audit baru
Jangan memuat gambar Largest Contentful Paint secara lambat
Gambar pemuatan lambat dapat menjadi cara efektif untuk menunda gambar di luar layar sehingga tidak mengganggu pemuatan konten yang ada di paruh atas.
Namun, jika elemen LCP halaman adalah gambar, pemuatan lambat pada gambar tersebut dapat berdampak negatif yang signifikan pada LCP. Browser dapat menempatkan gambar dalam antrean dan mengambil resource lain terlebih dahulu, alih-alih memprioritaskan gambar untuk download langsung. Sebuah studi baru-baru ini tentang pemuatan lambat di WordPress menemukan bahwa LCP dapat meningkat hingga 15% untuk beberapa situs jika gambar di area pandang awal tidak dimuat dengan lambat.
Lighthouse kini akan mendeteksi apakah elemen LCP adalah gambar yang dimuat lambat dan merekomendasikan untuk menghapus atribut loading
dari gambar tersebut.
Untuk informasi selengkapnya, lihat proposal awal dan permintaan pull penerapan.
Menyetel area pandang seluler untuk Penundaan Input Pertama yang lebih baik
Audit viewport
telah menjadi bagian dari kategori Praktik Terbaik selama bertahun-tahun, tetapi 8.4 juga menerima saran ini untuk kategori Performa.
Banyak browser seluler mendukung "ketuk dua kali untuk zoom" memungkinkan pengguna memperbesar konten yang tidak dirancang untuk layar seluler dengan mudah, yaitu konten tanpa <meta name="viewport">
seluler eksplisit. Dalam praktiknya, hal ini berarti browser harus menunggu 300 md setelah pengguna mengetuk untuk melihat apakah ketukan kedua akan dilakukan, dan selama waktu tersebut halaman tidak dapat merespons ketukan awal. Hal ini berarti FID yang gagal selama beberapa ratus milidetik.
Dalam studi data terbaru dari HTTP Archive, lebih dari setengah situs yang menerima skor 90 atau lebih tinggi di Lighthouse, tetapi gagal setidaknya satu Core Web Vital, tidak menetapkan area pandang seluler, dan gagal dalam FID. Akibatnya, bagian performa Lighthouse sekarang akan merekomendasikan penambahan area pandang seperti berikut jika tidak ada yang ditemukan:
<meta name="viewport" content="width=device-width">
Untuk mengetahui detail selengkapnya, lihat masalah proposal dan permintaan pull penerapan.
Menghubungi tim Lighthouse
Untuk membahas fitur-fitur baru, perubahan dalam versi 8.4, atau hal lain yang terkait dengan Lighthouse:
- Laporkan masalah atau kirimkan masukan melalui repo GitHub Lighthouse.
- Hubungi tim Lighthouse di Twitter @____lighthouse.