Alat Performa gratis
Tes Kecepatan Website
Kami memuat halaman Anda seperti ponsel kelas menengah dengan koneksi 4G lambat, mengukur seberapa cepat konten utama muncul dan seberapa banyak halaman bergeser, lalu menunjukkan apa yang membuatnya berat. Jika Google memiliki data pengguna nyata untuk website Anda, data itu juga ditampilkan.
Gratis. Biasanya selesai dalam kurang dari satu menit.
Yang dicek alat ini
Ponsel dengan 4G lambat
Halaman dimuat di Chromium sebagai ponsel kelas Moto G Power (412 × 823) dengan latensi 150 ms, kecepatan unduh sekitar 1,6 Mbps dan unggah 750 Kbps, serta CPU 4× lebih lambat. Ini adalah profil yang dipakai Lighthouse untuk tes mobile.
Largest Contentful Paint
Kapan gambar atau blok teks terbesar di layar pertama selesai dirender, dan elemen mana itu.
Cumulative Layout Shift
Seberapa banyak konten yang terlihat bergeser secara tak terduga saat halaman dimuat.
Total Blocking Time
Berapa lama skrip membuat browser terlalu sibuk untuk merespons sentuhan: bagian dari setiap tugas panjang yang melebihi 50 ms, dijumlahkan. Ini adalah pengganti Interaction to Next Paint dalam pengujian lab.
Apa yang diunduh halaman
Total byte dan permintaan, dibagi menjadi gambar, skrip, CSS, dan font, serta porsi yang berasal dari pihak ketiga.
Gambar berat dan file yang memblokir render
Gambar di atas 150 KB atau yang jauh lebih lebar daripada ruang tempatnya ditampilkan, serta file CSS dan skrip yang menahan render pertama.
Data pengguna nyata dari Chrome
Chrome UX Report dari Google untuk origin Anda di ponsel pada persentil ke-75: LCP, INP, dan CLS, jika Google memiliki cukup traffic untuk website tersebut.
Yang tidak dapat dicek
- Memberikan angka yang sama di setiap pengujian. Hasil lab bervariasi menurut jaringan, beban server, dan skrip pihak ketiga, jadi bandingkan trennya, bukan hasil satu kali pengujian.
- Sama persis dengan PageSpeed Insights. Keduanya memakai profil ponsel yang mirip, tetapi berjalan di mesin dan jaringan yang berbeda.
- Mengukur INP di lab. INP membutuhkan interaksi nyata, jadi tes lab menampilkan TBT dan data lapangan menampilkan INP jika tersedia.
- Menampilkan data lapangan untuk setiap website. Chrome UX Report mencakup 28 hari terakhir dan hanya origin dengan traffic Chrome yang cukup.
- Menguji lebih dari satu halaman yang Anda masukkan. Laporan Perbaikan Performa berbayar menguji 3 halaman penting dan mengurutkan penyebabnya beserta perbaikannya.
Mengapa ini penting
Halaman yang terasa instan di Wi-Fi kantor dan laptop yang cepat bisa butuh beberapa detik di ponsel kelas menengah dengan sinyal lemah. Situasi itulah yang ditiru tes ini, karena di situlah gambar dan skrip yang berat paling merugikan.
Core Web Vitals adalah ukuran Google untuk pengalaman tersebut: pemuatan (LCP), responsivitas (INP), dan stabilitas visual (CLS). Google memakainya dalam peringkat, tetapi menyatakan bahwa pengalaman halaman yang baik tidak mengalahkan konten yang relevan. Dampak yang lebih besar justru pada manusia: halaman yang lambat atau terus bergeser kehilangan pengunjung sebelum mereka sempat membaca apa pun.
Penyebabnya biasanya konkret: gambar hero berukuran beberapa megabyte yang tidak dikompresi, widget chat yang dimuat sebelum konten, web font yang menyembunyikan teks, atau banner yang disisipkan di atas halaman setelah halaman muncul. Tes ini menyebutkan elemen LCP dan file terberat, sehingga Anda bisa melihat penyebab mana yang berlaku.
Cara membaca hasilnya
- Largest Contentful Paint (LCP)
- Baik jika di bawah 2,5 detik, buruk jika di atas 4 detik. Jika elemen LCP berupa gambar, ukuran dan prioritas pemuatannya paling berpengaruh; jika berupa teks, periksa web font dan CSS yang memblokir render.
- Cumulative Layout Shift (CLS)
- Baik jika di bawah 0,1, buruk jika di atas 0,25. Skor tanpa satuan yang menggabungkan seberapa banyak bagian layar yang bergeser dan seberapa jauh.
- Total Blocking Time (TBT)
- Baik jika di bawah 200 ms, buruk jika di atas 600 ms. TBT yang tinggi menandakan respons yang lambat terhadap sentuhan bagi pengguna nyata.
- Byte dan permintaan
- Tidak ada batas resmi; lihat jenis mana yang mendominasi. Gambar biasanya merupakan porsi terbesar, dan porsi pihak ketiga yang tinggi menunjukkan peran aplikasi, tag, dan widget.
- Gambar berat
- Setiap gambar di atas 150 KB, atau yang diunduh jauh lebih lebar daripada ukuran tampilnya, beserta ukuran file dan dimensinya.
- File yang memblokir render
- CSS dan skrip sinkron yang harus diunduh browser sebelum bisa menampilkan apa pun.
- Data lapangan (persentil ke-75)
- Pengguna Chrome nyata di ponsel selama 28 hari terakhir. Persentil ke-75 berarti tiga dari empat pemuatan halaman setidaknya secepat ini. INP baik jika di bawah 200 ms dan buruk jika di atas 500 ms.
- Tidak ada data lapangan
- Google tidak memiliki cukup traffic Chrome untuk origin Anda. Ini tidak mengatakan apa pun tentang kecepatan website Anda; andalkan hasil lab.
Cara memperbaiki masalah yang paling umum
Gambar LCP yang lambat
Sajikan gambar hero sesuai ukuran tampilnya, dengan srcset, dalam format WebP atau AVIF. Jangan gunakan lazy load untuk gambar ini, tambahkan fetchpriority="high", dan letakkan di HTML sebagai elemen img, bukan dimuat dari skrip atau latar CSS.
Konten yang bergeser saat dimuat
Beri gambar, video, dan embed atribut width dan height atau aspect-ratio CSS. Sediakan ruang untuk banner, pemberitahuan cookie, dan iklan, atau tampilkan sebagai overlay yang tidak mendorong konten ke bawah. Untuk web font, gunakan font-display: optional atau font cadangan yang ukurannya disesuaikan.
Total Blocking Time yang tinggi
Pertama, hapus aplikasi, tag, dan plugin yang tidak lagi Anda pakai; skripnya sering tetap ada setelah Anda berhenti memakainya. Muat chat, ulasan, dan analitik dengan defer atau setelah halaman interaktif. Di Shopify, periksa Toko Online › Tema › Sesuaikan › Sematan aplikasi (App embeds).
CSS dan skrip yang memblokir render
Tambahkan defer pada skrip yang tidak perlu dijalankan sebelum paint pertama, sisipkan langsung (inline) sedikit CSS yang dibutuhkan layar pertama, dan buang stylesheet untuk fitur yang tidak dipakai halaman.
Gambar yang terlalu berat
Ubah ukuran gambar sebelum diunggah (lebar sekitar 2000 px sudah lebih dari cukup untuk banner selebar layar) lalu kompres. Shopify dan WordPress dapat menyajikan versi yang lebih kecil secara otomatis jika tema memintanya, jadi pastikan tema Anda memakai ukuran gambar responsif.
Pertanyaan tentang alat ini
Mengapa hasil saya berbeda dari PageSpeed Insights?
Tes lab bergantung pada mesin, jaringan, dan waktu pengujian. PageSpeed Insights menjalankan Lighthouse di server Google dan menyimulasikan koneksi lambat, sedangkan kami menerapkan throttling di browser sungguhan. Harapkan rentang yang mirip, bukan angka yang identik.
Berapa LCP yang baik?
2,5 detik atau kurang untuk setidaknya 75% pemuatan halaman, menurut web.dev. Lebih dari 4 detik tergolong buruk.
Mengapa tidak ada data pengguna nyata untuk website saya?
Chrome UX Report hanya mencakup origin yang dapat ditemukan secara publik dan mendapat cukup kunjungan dari pengguna Chrome yang membagikan statistik penggunaan. Banyak website kecil tidak mencapai tingkat itu; tes lab tetap menunjukkan apa yang perlu diperbaiki.
Mengapa menguji di ponsel lambat, bukan di desktop?
Karena masalah muncul di sana lebih dulu. Laptop yang cepat menyembunyikan gambar dan skrip berat yang menghabiskan beberapa detik di ponsel kelas menengah, dan Lighthouse memakai profil ponsel yang sama untuk tes mobile-nya.
Apa yang terjadi dengan First Input Delay?
Interaction to Next Paint (INP) menggantikan First Input Delay sebagai Core Web Vital pada Maret 2024. INP melihat jeda interaksi sepanjang kunjungan, bukan hanya interaksi pertama.
Sumber
- web.dev: Web Vitals(terbuka di tab baru)
- web.dev: Largest Contentful Paint (LCP)(terbuka di tab baru)
- web.dev: Cumulative Layout Shift (CLS)(terbuka di tab baru)
- web.dev: Interaction to Next Paint (INP)(terbuka di tab baru)
- web.dev: Total Blocking Time (TBT)(terbuka di tab baru)
- Chrome for Developers: Chrome UX Report(terbuka di tab baru)
- Lighthouse: Throttling jaringan(terbuka di tab baru)
Alat terkait
- TeknisAudit Website GratisSatu pemindaian untuk aksesibilitas, SEO, kecepatan, konversi, keamanan, dan pengaturan email, dengan temuan terpenting di setiap area.Buka alat
- SEOCek SEO WebsiteTemukan masalah SEO teknis di halaman-halaman penting Anda yang membuat halaman tidak muncul di pencarian atau tampil lebih buruk di hasil pencarian.Buka alat
- SEOCek Meta TagLihat title, meta description, canonical, robots, Open Graph, dan tag head lain dari halaman mana pun, lengkap dengan pratinjau pencarian dan media sosial.Buka alat
Butuh perbaikannya, bukan sekadar temuannya?
Laporan Perbaikan Performa ($55, sekali bayar) dimulai dari pemindaian gratis lengkap dan menambahkan lebih banyak halaman, perubahan yang perlu dibuat untuk setiap temuan, PDF, serta uji ulang untuk memverifikasi perbaikan Anda.