Cara Lighthouse menghitung skor Performa Anda secara keseluruhan
Secara umum, hanya metrik yang berkontribusi pada skor Performa Lighthouse Anda, bukan hasil Peluang atau Diagnostik. Meskipun demikian, meningkatkan peluang dan diagnostik kemungkinan akan meningkatkan nilai metrik, sehingga ada hubungan tidak langsung.
Di bawah ini, kami telah menguraikan mengapa skor dapat berfluktuasi, bagaimana skornya, dan bagaimana Lighthouse menilai setiap metrik.
Mengapa skor Anda berfluktuasi
Banyak variabilitas dalam skor Performa dan nilai metrik Anda secara keseluruhan bukan disebabkan oleh Lighthouse. Saat Skor performa berfluktuasi, biasanya hal tersebut disebabkan oleh perubahan pada kondisi yang mendasarinya. Masalah umum meliputi:
- Pengujian A/B atau perubahan pada iklan yang ditayangkan
- Perubahan pemilihan rute traffic internet
- Pengujian di berbagai perangkat, seperti desktop berperforma tinggi dan laptop berperforma rendah
- Ekstensi browser yang memasukkan JavaScript dan menambahkan/mengubah permintaan jaringan
- Software antivirus
Dokumentasi Lighthouse tentang Variabilitas membahas hal ini secara lebih mendalam.
Selain itu, meskipun Lighthouse dapat memberikan satu skor Performa keseluruhan, mungkin akan lebih berguna jika Anda menganggap performa situs sebagai distribusi skor, bukan sebagai angka tunggal. Lihat pengantar Metrik Performa yang Berfokus pada Pengguna untuk memahami alasannya.
Cara skor Performa diberi bobot
Skor Performa adalah rata-rata tertimbang dari skor metrik. Tentunya, metrik yang lebih berbobot akan berdampak lebih besar pada keseluruhan skor Performa Anda. Skor metrik tidak terlihat dalam laporan, tetapi dihitung di balik layar.
Lighthouse 10
| Audit | Berat |
|---|---|
| First Contentful Paint | 10% |
| Indeks Kecepatan | 10% |
| Largest Contentful Paint (LCP) | 25% |
| Total Waktu Pemblokiran | 30% |
| Pergeseran Tata Letak Kumulatif | 25% |
Lighthouse 8
| Audit | Berat |
|---|---|
| First Contentful Paint | 10% |
| Indeks Kecepatan | 10% |
| Largest Contentful Paint (LCP) | 25% |
| Time to Interactive | 10% |
| Total Blocking Time | 30% |
| Pergeseran Tata Letak Kumulatif (CLS) | 15% |
Cara menentukan skor metrik
Setelah mengumpulkan metrik performa (sebagian besar dilaporkan dalam milidetik), Lighthouse akan mengonversi setiap nilai metrik mentah menjadi skor metrik dari 0 hingga 100 dengan melihat posisi nilai metrik pada distribusi penskoran Lighthouse. Distribusi penskoran adalah distribusi log-normal yang berasal dari metrik performa data performa situs sebenarnya di HTTP Archive.
Misalnya, Largest Contentful Paint (LCP) mengukur saat pengguna merasa bahwa konten terbesar suatu halaman sudah terlihat. Nilai metrik untuk LCP mewakili durasi waktu antara saat pengguna memulai pemuatan halaman dan halaman merender konten utamanya. Berdasarkan data situs sebenarnya, situs berperforma terbaik merender LCP dalam waktu sekitar 1.220 md, sehingga nilai metrik dipetakan ke skor 99.
Lebih mendalam lagi, model kurva skor Lighthouse menggunakan data HTTPArchive untuk menentukan dua titik kontrol yang kemudian menetapkan bentuk kurva log-normal. Persentil ke-25 data HTTP Archive menjadi skor 50 (titik kontrol median), dan persentil ke-8 menjadi skor 90 (titik kontrol baik/hijau). Saat menjelajahi plot kurva penskoran, perhatikan bahwa antara 0,50 dan 0,92, ada hubungan yang hampir linear antara nilai metrik dan skor. Sekitar skor 0,96 adalah "titik penurunan hasil" karena semakin tinggi, kurva akan menjauh, sehingga memerlukan peningkatan metrik yang semakin banyak untuk meningkatkan skor yang sudah tinggi.
Cara penanganan desktop versus seluler
Seperti yang disebutkan, kurva skor ditentukan dari data performa sebenarnya. Sebelum Lighthouse v6, semua kurva skor didasarkan pada data performa seluler, tetapi Lighthouse desktop yang dijalankan akan menggunakannya. Dalam praktiknya, hal ini menyebabkan skor desktop yang dilebih-lebihkan. Lighthouse v6 memperbaiki {i>bug<i} ini dengan menggunakan penskoran desktop khusus. Meskipun Anda tentu dapat mengharapkan perubahan keseluruhan dalam skor kinerja Anda dari 5 hingga 6, skor untuk desktop akan sangat berbeda.
Cara skor diberi kode warna
Skor metrik dan skor performa diberi warna sesuai dengan rentang ini:
- 0 hingga 49 (merah): Buruk
- 50 hingga 89 (oranye): Perlu Peningkatan
- 90 hingga 100 (hijau): Baik
Untuk memberikan pengalaman pengguna yang baik, situs harus berusaha memiliki skor yang baik (90-100). Skor "sempurna" 100 sangat sulit dicapai dan tidak diharapkan. Misalnya, mengambil skor dari 99 ke 100 membutuhkan jumlah peningkatan metrik yang sama dengan yang membutuhkan 90 hingga 94.
Apa yang dapat dilakukan developer untuk meningkatkan skor performa mereka?
Pertama, gunakan kalkulator penskoran Lighthouse untuk membantu memahami nilai minimum yang harus Anda capai untuk mendapatkan skor performa Lighthouse tertentu.
Dalam laporan Lighthouse, bagian Peluang memiliki saran dan dokumentasi mendetail tentang cara menerapkannya. Selain itu, bagian Diagnostik mencantumkan panduan tambahan yang dapat dijelajahi developer untuk lebih meningkatkan performa mereka.