Catatan Kecil WebPageTest

Webpagetest adalah salah satu alat gratis untuk mengukur performa halaman website. Webpagetest memungkinkan kita untuk menjalankan tes performa website di sejumlah lokasi berbeda di seluruh dunia dan di sejumlah browser berbeda pula.

Median run table: tabel yang menampilkan rata-rata dari berapa kali tes yang dijalankan.

First view: Kunjungan pertama pengguna ke website.

Repeat view: Kunjungan berikutnya setelah kunjungan pertama pengguna ke website. Pada kunjungan ini, website lebih cepat dimuat karena ada beberapa aset yang sudah di cache oleh browser pada fase First view. Biasanya aset-aset tersebut disimpan di disk cache atau memory cache.

Load time/Document complete: Fase yang dibutuhkan untuk memuat semua aset (HTML, CSS, JS, gambar (bila ada)) yang diperlukan untuk merender halaman web. Di fase ini pengguna sudah bisa berinteraksi pada halaman web.

Jika load time lambat maka kita perlu optimasi kode, aset dan database.

First byte: Waktu yang diperlukan untuk mendapatkan first byte response dari server. Istilah lain first byte adalah Time to First Byte (TTFB).

Analogi first byte dalam kehidupan nyata misalnya petugas JNE datang mengantar barang ke rumah.

Petugas JNE: "Permisi, ada paket!"
(Menunggu respon dari tuan rumah...)
Tuan rumah: "Ya, tunggu sebentar"

Bagian menunggu respon dari tuan rumah hingga tuan rumah membalas sahutan petugas JNE inilah yang disebut dengan first byte.

Ambang batas Time to First Byte adalah 600 ms berdasarkan source code Lighthouse: (cari TTFB_THRESHOLD).

Jika first byte melebihi ambang batas maka kemungkinannya ada di jaringan internet yang kita pakai untuk mengakses website atau konfigurasi di server website.

Start render: Berapa lama waktu yang dibutuhkan oleh browser untuk mulai menampilkan konten halaman web atau titik di mana halaman putih tidak lagi ditampilkan.

First Contentful Paint (FCP): bertugas untuk menangkap waktu ketika browser merender bit pertama konten dari sebuah DOM. Konten tersebut berupa teks, gambar (termasuk gambar latar belakang (background image)), non-white canvas atau SVG.

Speed index: waktu rata-rata menunjukkan seberapa cepat konten suatu halaman terlihat jelas.

Last Painted Hero: waktu last hero element terlihat di viewport. WebPageTest menetapkan beberapa hero element di antaranya:

  1. H1. Tag <h1> terbesar yang terlihat di viewport. Jika tidak ada tag <h1> maka tag <h2> terbesar yang digunakan.
  2. Largest Image. Tag <img> terbesar yang terlihat di viewport.
  3. Largest Background Image alias gambar latar yang paling besar.

First CPU Idle atau Time to Interactive (TTI): bertugas untuk mengukur berapa lama sebuah halaman menjadi interaktif sepenuhnya. Halaman dianggap interaktif sepenuhnya saat:

  1. Halaman sudah menampilkan konten yang bermanfaat, yang mana diukur pada First Contentful Paint
  2. Event handler telah terdaftar untuk sebagian besar elemen pada halaman yang terlihat.
  3. Halaman merespons interaksi pengguna dalam 5 detik.

Fully Loaded: waktu halaman dimuat penuh. Biasanya nilai waktu dari Fully loaded lebih besar daripada Load time/Document complete karena Fully loaded mengukur request tambahan (bila ada) setelah Load time/Document complete. Umumnya, kisaran perbedaan antara waktu Fully loaded dengan Load time/Document complete sebesar dua detik atau lebih.

Referensi