Metrik performa baru, update pada PageSpeed Insights dan Laporan Pengalaman Pengguna Chrome (CrUX), dan lainnya.
Di Chrome Developer Summit, Paul Irish dan saya mengumumkan update pada Lighthouse—Lighthouse CI, formula skor performa baru, dan lainnya. Bersama dengan berita besar Lighthouse, kami mempresentasikan pengembangan alat performa yang menarik, termasuk metrik performa baru, update pada PageSpeed Insights dan Chrome User Experience Report (CrUX), dan insight dari analisis Web Almanac tentang ekosistem web.
Metrik performa baru
Mengukur nuansa pengalaman pengguna adalah kunci untuk mengukur dampak yang dihasilkannya terhadap laba bersih Anda dan melacak peningkatan serta regresi. Seiring waktu, metrik baru telah berkembang untuk menangkap nuansa tersebut dan mengisi kesenjangan dalam mengukur pengalaman pengguna. Penambahan terbaru pada kisah metrik adalah dua metrik kolom—Largest Contentful Paint (LCP) dan Cumulative Layout Shift (CLS)—yang sedang diinkubasi di W3C Web Performance Working Group, dan metrik lab baru—Total Blocking Time (TBT).
Largest Contentful Paint (LCP)
Largest Contentful Paint (LCP) melaporkan waktu saat elemen konten terbesar menjadi terlihat di area pandang.
Sebelum Largest Contentful Paint, First Artiful Paint (FMP) dan Speed Index (SI) berfungsi untuk menangkap pengalaman pemuatan setelah penggambaran awal, tetapi metrik ini kompleks dan sering kali tidak mengidentifikasi kapan konten utama halaman telah dimuat. Riset telah menunjukkan bahwa hanya melihat kapan elemen terbesar di halaman dirender akan lebih mewakili kapan konten utama halaman dimuat.
Metrik Largest Contentful Paint baru akan segera tersedia dalam laporan Lighthouse, dan sementara itu Anda dapat mengukur LCP dalam JavaScript.
Waktu Pemblokiran Total (TBT)
Metrik Total Blocking Time (TBT) mengukur jumlah total waktu antara First Contentful Paint (FCP) dan Time to Interactive (TTI), tempat thread utama diblokir cukup lama untuk mencegah responsivitas input.
Tugas dianggap panjang jika berjalan di thread utama selama lebih dari 50 milidetik. Setiap milidetik di atasnya akan dihitung terhadap waktu pemblokiran tugas tersebut.
Total Waktu Pemblokiran untuk halaman adalah jumlah waktu pemblokiran untuk semua tugas lama yang terjadi antara FCP dan TTI.
Meskipun Time to Interactive berfungsi dengan baik dalam mengidentifikasi kapan thread utama menjadi stabil nanti saat dimuat, Total Blocking Time bertujuan untuk mengukur seberapa berat beban thread utama selama pemuatan. Dengan cara ini, TTI dan TBT saling melengkapi dan memberikan keseimbangan.
Pergeseran Tata Letak Kumulatif (CLS)
Pergeseran Tata Letak Kumulatif (CLS) mengukur stabilitas visual halaman dan mengukur seberapa sering pengguna mengalami pergeseran tata letak yang tidak terduga. Pergerakan konten yang tidak terduga dapat sangat menjengkelkan dan metrik baru ini membantu Anda mengatasi masalah tersebut dengan mengukur frekuensi terjadinya hal tersebut bagi pengguna.
Lihat panduan mendetail tentang Pergeseran Tata Letak Kumulatif untuk mempelajari cara penghitungannya dan cara mengukurnya.
Formula skor performa Lighthouse yang baru akan segera mengurangi penekanan FMP dan FCI serta menyertakan tiga metrik baru—LCP, TBT, dan CLS—karena keduanya menangkap dengan lebih baik saat halaman terasa berguna.
Lihat penskoran performa Lighthouse dan kumpulan metrik web.dev baru untuk mempelajari lebih lanjut.
Batas data kolom (CrUX) disesuaikan di PageSpeed Insights
Selama setahun terakhir, kami telah menganalisis performa web dari kolom melalui data Pengalaman Pengguna Chrome (CrUX). Dengan insight dari data tersebut, kami menilai ulang nilai minimum yang kami gunakan untuk memberi label "lambat", "sedang", atau "cepat" pada performa kolom.
Untuk mendapatkan penilaian keseluruhan untuk suatu situs, PageSpeed Insights (PSI) menggunakan persentil tertentu dari total distribusi data kolom sebagai angka emas untuk situs tersebut; nilai minimum sebelumnya yang digunakan adalah persentil ke-90 untuk First Contentful Paint dan persentil ke-95 untuk Penundaan Input Pertama (FID).
Misalnya, jika situs memiliki distribusi FCP 50% cepat, 30% sedang, 20% lambat, FCP persentil ke-90 berada di bagian lambat, sehingga skor kolom keseluruhan untuk situs menjadi lambat.
Hal ini telah disesuaikan agar memiliki distribusi yang lebih baik secara keseluruhan di seluruh situs dan perincian barunya adalah:
| Metrik | Persentil Keseluruhan | Cepat (md) | Sedang (md) | Lambat (md) |
| FCP | Persentil ke-75 | 1000 | 1000-3000 | 3000+ |
| FID | Persentil ke-95 | 100 | 100-300 | 300+ |
Misalnya, sekarang jika situs memiliki distribusi FCP 50% cepat, 30% sedang, 20% lambat, FCP persentil ke-75 berada di bagian sedang, sehingga skor kolom keseluruhan untuk situs tersebut menjadi sedang.
Pengalihan URL kanonis di PageSpeed Insights
Agar Anda dapat mengukur pengalaman pengguna seakurat mungkin, tim PageSpeed Insights telah menambahkan perintah analisis ulang ke PSI. Untuk situs yang dialihkan ke URL baru, Anda akan diminta untuk menjalankan ulang laporan di URL landing untuk mendapatkan gambaran yang lebih lengkap tentang performa sebenarnya.
CrUX di laporan Kecepatan Search Console baru
Search Console meluncurkan laporan Kecepatan baru seminggu sebelum Chrome Dev Summit. Laporan ini menggunakan data dari Laporan Pengalaman Pengguna Chrome untuk membantu pemilik situs menemukan potensi masalah pengalaman pengguna. Laporan Kecepatan akan otomatis menetapkan grup URL yang mirip ke dalam kelompok "Cepat", "Sedang", dan "Lambat", serta membantu memprioritaskan peningkatan performa untuk masalah tertentu.
Web Almanac
Dalam keynote pembukaan, kami mengumumkan peluncuran Web Almanac, sebuah project tahunan yang mencocokkan statistik dan tren tentang status web dengan keahlian komunitas web. 85 kontributor, yang terdiri dari developer Chrome dan komunitas web, telah secara sukarela mengerjakan project ini, yang menganalisis 20 aspek inti tentang web yang membahas cara situs dibuat, dikirimkan, dan digunakan. Mulai jelajahi Web Almanac untuk mempelajari lebih lanjut status kode performa, JavaScript, dan pihak ketiga di web.
Pelajari lebih lanjut
Untuk mengetahui detail selengkapnya tentang update alat performa dari Chrome Developer Summit, tonton presentasi Evolusi alat kecepatan: