MATERI 18 / 20
Performa: ukur sebelum mengoptimalkan
Aplikasi terasa lambat karena berbagai sebab: jaringan, aset besar, proses berat atau interaksi yang tertahan. Pengukuran membantu memilih perbaikan yang memengaruhi pengalaman nyata.
Tentukan pertanyaan pengukuran
Apakah lambat saat halaman pertama terbuka, saat mengetik, atau saat menyimpan? Gunakan kondisi pengujian yang konsisten dan catat perangkat serta jaringan. Satu pengukuran di laptop cepat tidak mewakili seluruh pengguna. Ulangi secukupnya untuk melihat variasi sebelum menyimpulkan perbedaan kecil.
Cari bagian yang paling mahal
Panel Network membantu melihat ukuran dan waktu pemuatan sumber daya; alat Performance membantu menelusuri pekerjaan di browser. Gambar terlalu besar, JavaScript tidak perlu dan pekerjaan sinkron panjang dapat menjadi hambatan berbeda. Prioritaskan berdasarkan dampak yang diamati, lalu lakukan satu perubahan yang dapat dibandingkan.
Optimasi memiliki biaya
Cache mempercepat penggunaan ulang tetapi memerlukan aturan kesegaran. Memuat banyak data sekaligus dapat mengurangi request namun memperbesar respons. Kompresi gambar dapat mengurangi ukuran sambil mengubah kualitas. Simpan hasil sebelum dan sesudah, lalu pastikan fungsi, aksesibilitas serta kualitas visual tetap memenuhi kebutuhan.
Pertanyaan: mengapa hero terlambat terlihat? Kondisi: viewport sama, cache dingin, jaringan sama Temuan: satu gambar jauh lebih besar dari kebutuhan Perubahan: ukuran gambar sesuai tampilan Bandingkan: waktu, byte, ketajaman dan layout
Giliran kamu.
Ukur halaman latihan sebelum dan setelah satu perubahan aset. Catat kondisi, ukuran transfer, waktu yang diamati dan dampak pada kualitas visual.
- Pertanyaan dan kondisi pengukuran jelas
- Perubahan menjawab hambatan teramati
- Fungsi dan kualitas tetap diperiksa