Performa adalah bagian dari desain
Sebuah desain perlu mempertimbangkan jumlah aset, berat media, serta kapan konten muncul. Hindari menambahkan library atau animasi besar bila pengalaman yang sama dapat dibuat dengan CSS dan sedikit JavaScript.
Kenali tiga aspek pengalaman
Core Web Vitals menilai pemuatan konten utama melalui LCP, respons interaksi melalui INP, dan stabilitas tampilan melalui CLS. Ketiganya membantu melihat masalah yang berbeda, sehingga solusi tidak selalu berupa memperkecil gambar.
Siapkan gambar dengan ukuran yang tepat
Gunakan format dan dimensi sesuai penampilan gambar. Tetapkan width dan height untuk membantu browser menyediakan ruang sejak awal. Media di bawah layar awal dapat menggunakan lazy loading; jangan menunda gambar utama yang diperlukan segera.
Utamakan font dan script yang efisien
Batasi keluarga dan variasi font, gunakan file yang sesuai, serta pastikan teks tetap terlihat saat font dimuat. Script pelengkap sebaiknya tidak menghalangi konten utama atau menambah pekerjaan yang tidak diperlukan.
Bedakan pengujian lab dan data nyata
Pengujian di satu perangkat memberi sinyal untuk perbaikan. Data pengguna nyata mencerminkan variasi jaringan, perangkat, dan interaksi. Website baru mungkin belum memiliki data lapangan; jangan menganggap skor lab sebagai hasil semua pengunjung.
Jadikan pengukuran sebagai kebiasaan
Periksa halaman utama dan template penting setelah perubahan. Bandingkan hasil dengan kondisi pengujian yang sama, lalu prioritaskan masalah yang memengaruhi pengguna. Website akan berkembang, jadi performa perlu dijaga bersama konten dan fitur baru.
Referensi & bacaan lanjutan
web.dev — Core Web Vitals (tab baru)Bahas kebutuhan bisnis Anda.
Kenali lingkup layanan dan siapkan pertanyaan untuk diskusi.
Lihat layanan terkait