Mengaudit Performa

Mengapa dan apa?

Anda mungkin pernah mendengar tentang semua hal baik yang dapat dilakukan teknik Progressive Web App untuk situs Anda. Anda mungkin merasa tergoda untuk langsung menambahkan fitur PWA. Itu mungkin, tetapi Anda akan jauh lebih baik jika Anda 'siap PWA' terlebih dahulu.

Keajaiban PWA tidak akan memperbaiki masalah seperti memblokir JavaScript atau gambar yang membengkak. PWA membutuhkan fondasi yang solid.

Jadi, bagaimana cara memeriksa kesiapan situs Anda? Langkah pertama adalah melakukan audit situs: peninjauan tujuan tentang apa yang berfungsi dengan baik dan di mana (dan bagaimana) perbaikan dapat dilakukan.

Mengaudit situs atau aplikasi akan membantu Anda membangun pengalaman yang tangguh dan berperforma tinggi — serta menyoroti manfaat cepat yang dapat diterapkan dengan sedikit persetujuan. Audit juga memberi Anda dasar untuk pengembangan berbasis data. Apakah perubahan membuat segalanya lebih baik? Bagaimana situs Anda dibandingkan dengan pesaing? Anda mendapatkan metrik untuk memprioritaskan upaya, dan bukti konkret untuk dibanggakan setelah Anda melakukan peningkatan.

Jika Anda hanya memiliki waktu 5 menit...

Jalankan Lighthouse di halaman beranda Anda dan simpan data laporan. Anda akan mendapatkan dasar pengukuran terkuantifikasi dan daftar tugas untuk meningkatkan performa, aksesibilitas, keamanan, dan SEO.

Jika Anda hanya punya waktu 30 menit...

Lighthouse mungkin masih menjadi tempat terbaik untuk memulai, tetapi dengan sedikit waktu, Anda juga dapat merekam hasil dari alat lain:

  • Panel Keamanan Chrome DevTools: Penggunaan HTTPS.
  • Panel Jaringan Chrome DevTools: pengaturan waktu pemuatan; ukuran resource, dan jumlah permintaan untuk HTML, CSS, JavaScript, gambar, font, dan file lainnya.
  • Pengelola Tugas Chrome: jika situs Anda terus-menerus menggunakan CPU yang signifikan atau lebih banyak memori daripada aplikasi lain, Anda mungkin perlu memperbaiki kebocoran memori, tugas yang berjalan, atau masalah pemuatan resource. Pastikan untuk menguji situs Anda pada perangkat yang mewakili pengguna Anda.
  • WebPagetest: performa untuk berbagai lokasi dan jenis koneksi, penyimpanan cache, waktu ke byte pertama, penggunaan CDN.
  • PageSpeed Insights: performa pemuatan, biaya data, dan penggunaan resource, termasuk data laporan Pengalaman Pengguna Chrome yang menyoroti statistik performa sebenarnya.
  • Kartu Skor Kecepatan dan Pengukur Dampak: bandingkan kecepatan situs dengan pembanding dan perkirakan peluang pendapatan potensial untuk meningkatkan kecepatan situs.

Pastikan untuk menguji {i>website<i} Anda saat pengguna baru melihatnya. Buka jendela Samaran (Pribadi) di situs, atau gunakan alat browser untuk menonaktifkan penyimpanan cache dan menghapus penyimpanan. Cara ini memastikan setiap aset diambil dari jaringan, bukan dari cache lokal, sehingga Anda akan mendapatkan gambaran yang akurat tentang performa pemuatan pertama.

Tidak ada yang dapat mengalahkan pengujian di dunia nyata. Coba situs Anda dengan perangkat dan konektivitas yang sama dengan pengguna dan catat pengalaman subjektif Anda.

Jika kamu mendapati berbagai alat yang membingungkan...

Lihat panduan kami: Cara Mempertimbangkan Alat Kecepatan.

Jika tidak ada yang lain, cukup gunakan Lighthouse untuk memeriksa:

Audiens, pemangku kepentingan, konteks

Prioritas untuk pemfaktoran ulang bergantung pada audiens, konten, dan fungsi Anda. Siapa yang mengunjungi situs Anda? Mengapa dan bagaimana mereka menggunakannya? Berapa anggaran performa Anda? Jika Anda tidak yakin dengan pertanyaan ini, coba persyaratan yang mengumpulkan latihan dari referensi pelatihan PWA kami: Audiens Anda, konten Anda dan Desain untuk semua pengguna Anda.

Siapa pemangku kepentingan Anda, dan apa prioritas mereka? Hal ini akan mempengaruhi cara Anda menyusun, menyajikan, dan membagikan data audit.

Jika Anda tidak dapat mengaudit seluruh situs, periksa analisis halaman untuk mengetahui bagian situs yang perlu difokuskan. Rasio pantulan yang tinggi, waktu di halaman yang rendah, dan halaman keluar yang tidak terduga dapat menjadi indikator yang baik untuk memulai. Demikian juga dengan metrik bisnis seperti biaya hosting, klik iklan, dan konversi. Dapatkan gambaran umum dari pemangku kepentingan tentang data apa yang penting bagi mereka.

Uji, rekam, perbaiki, ulangi

Catat status situs Anda sebelum melakukan perubahan apa pun, untuk mengungkap masalah dan menetapkan titik awal untuk peningkatan atau regresi. Hal itu memberi Anda data untuk menjustifikasi dan menghargai upaya pengembangan.

Pastikan untuk menguji beberapa jenis halaman dalam situs Anda — bukan hanya halaman beranda. Untuk aplikasi satu halaman, uji berbagai komponen, rute, dan alur UX, bukan hanya pengalaman pemuatan pertama.

Masukan