Waktu untuk Interaktif (TTI)

Philip Walton

Time to Interactive (TTI) adalah metrik lab untuk mengukur responsivitas pemuatan. Alat ini membantu mengidentifikasi kasus ketika halaman terlihat interaktif tetapi sebenarnya tidak. TTI yang cepat membantu memastikan bahwa halaman tersebut dapat digunakan.

Apa itu TTI?

Metrik TTI mengukur waktu dari saat halaman mulai dimuat hingga sub-resource utamanya dimuat, dan mampu merespons input pengguna dengan cepat dan andal.

Untuk menghitung TTI berdasarkan trace performa halaman web, ikuti langkah-langkah berikut:

  1. Mulai dari First Contentful Paint (FCP).
  2. Menelusuri maju dalam waktu untuk jendela tenang minimal lima detik, dengan jendela hening didefinisikan sebagai: tidak ada tugas lama dan tidak lebih dari dua permintaan GET jaringan yang sedang berjalan.
  3. Menelusuri tugas panjang terakhir sebelum jendela senyap di belakang, dan berhenti di FCP jika tidak ada tugas panjang yang ditemukan.
  4. TTI adalah waktu berakhir tugas panjang yang terakhir sebelum jendela tenang (atau nilai yang sama dengan FCP jika tidak ada tugas panjang yang ditemukan).

Diagram berikut akan membantu memvisualisasikan langkah-langkah di atas:

Linimasa pemuatan halaman yang menunjukkan cara menghitung TTI

Secara historis, developer telah mengoptimalkan halaman untuk waktu render yang cepat, terkadang dengan mengorbankan TTI.

Teknik seperti rendering sisi server (SSR) dapat menyebabkan skenario saat halaman terlihat interaktif (yaitu, link dan tombol terlihat di layar), tetapi tidak sebenarnya interaktif karena thread utama diblokir atau karena kode JavaScript yang mengontrol elemen tersebut belum dimuat.

Saat pengguna mencoba berinteraksi dengan halaman yang terlihat interaktif tetapi sebenarnya tidak, mereka mungkin akan merespons dengan salah satu dari dua cara berikut:

  • Dalam skenario kasus terbaik, dia akan kesal karena halaman merespons dengan lambat.
  • Dalam skenario terburuk, mereka akan menganggap halaman tersebut rusak dan kemungkinan akan pergi. Mereka bahkan bisa kehilangan kepercayaan atau kepercayaan terhadap nilai brand Anda.

Untuk menghindari masalah ini, lakukan segala upaya untuk meminimalkan perbedaan antara FCP dan TTI. Jika terdapat perbedaan yang mencolok, perjelas melalui indikator visual bahwa komponen di halaman Anda belum interaktif.

Cara mengukur TTI

TTI adalah metrik yang paling baik diukur di lab. Cara terbaik untuk mengukur TTI adalah dengan menjalankan audit performa Lighthouse di situs Anda. Lihat dokumentasi Lighthouse tentang TTI untuk mengetahui detail penggunaan.

Alat lab

Berapa skor TTI yang bagus?

Untuk memberikan pengalaman pengguna yang baik, situs harus berupaya memiliki Waktu untuk Interaktif kurang dari 5 detik saat diuji pada hardware seluler rata-rata.

Untuk mengetahui detail tentang bagaimana TTI halaman memengaruhi skor performa Lighthouse Anda, lihat Cara Lighthouse menentukan skor TTI Anda.

Cara meningkatkan TTI

Untuk mempelajari cara meningkatkan TTI untuk situs tertentu, Anda dapat menjalankan audit performa Lighthouse dan memperhatikan setiap peluang tertentu yang disarankan audit.

Untuk mempelajari cara meningkatkan TTI secara umum (untuk situs apa pun), lihat panduan performa berikut: