Time to Interactive (TTI) (Czas do pełnej interaktywności)

Philip Walton

Czas do pełnej interaktywności (TTI) to wskaźnik laboratoryjny służący do pomiaru responsywności ładowania. Pomaga to wykrywać przypadki, gdy strona wygląda na interaktywną, ale tak naprawdę nie jest. Szybki czas TTI zapewnia, że strona jest użyteczna.

Co to jest TTI?

Dane TTI mierzą czas od rozpoczęcia wczytywania strony do momentu załadowania jej głównych zasobów podrzędnych. Jest ona w stanie szybko i bezbłędnie reagować na działania użytkowników.

Aby obliczyć TTI na podstawie śladu dotyczącego wydajności strony internetowej, wykonaj te czynności:

  1. Zacznij od pierwszego wyrenderowania treści (FCP).
  2. Przeszukaj okna czasowe o długości co najmniej 5 sekund, gdzie okno czasowe to okres, w którym nie ma długich zadań i nie ma więcej niż 2 przetwarzane żądania GET sieci.
  3. Przeszukaj wstecz ostatni długie zadanie przed okresem bezczynności, zatrzymując się na poziomie FCP, jeśli nie znajdziesz długich zadań.
  4. TTI to czas zakończenia ostatniego długiego zadania przed okresem ciszy (lub ta sama wartość co FCP, jeśli nie znaleziono żadnych długich zadań).

Poniższy diagram pomoże Ci wizualizować te czynności:

Czas wczytywania strony pokazujący, jak obliczyć TTI

Do tej pory deweloperzy optymalizowali strony pod kątem szybkiego renderowania, czasami kosztem TTI.

Techniki takie jak renderowanie po stronie serwera (SSR) mogą prowadzić do sytuacji, w której strona wygląda interaktywnie (czyli na ekranie są widoczne linki i przyciski), ale nie jest w rzeczywistości interaktywna, ponieważ główny wątek jest zablokowany lub kod JavaScript kontrolujący te elementy nie został załadowany.

Gdy użytkownicy próbują wchodzić w interakcję ze stroną, która wygląda na interaktywną, ale tak naprawdę nie jest, prawdopodobnie zareagują w jeden z 2 sposobów:

  • W najlepszym przypadku użytkownicy będą zniecierpliwieni z powodu długiego czasu reakcji strony.
  • W najgorszym przypadku użytkownik uzna, że strona jest uszkodzona, i prawdopodobnie ją opuści. Mogą nawet stracić zaufanie do Twojej marki.

Aby uniknąć tego problemu, dokładaj wszelkich starań, aby zminimalizować różnicę między FCP a TTI. W przypadku zauważalnej różnicy wyraźnie zaznacz wizualnie, że elementy na stronie nie są jeszcze interaktywne.

Jak mierzyć TTI

TTI to dane, które najlepiej mierzyć w laboratorium. Najlepszym sposobem na pomiar TTI jest przeprowadzenie w witrynie audytu skuteczności Lighthouse. Szczegółowe informacje o używaniu znajdziesz w dokumentacji Lighthouse na temat TTI.

Narzędzia laboratoryjne

Jaki jest dobry wynik TTI?

Aby zapewnić użytkownikom wygodę, witryny powinny mieć czas do interakcji poniżej 5 sekund podczas testowania na przeciętnym sprzęcie mobilnym.

Szczegółowe informacje o tym, jak TTI strony wpływa na wynik szybkości Lighthouse, znajdziesz w artykule Jak Lighthouse określa wynik TTI.

Jak poprawić TTI

Aby dowiedzieć się, jak poprawić TTI w przypadku konkretnej witryny, możesz przeprowadzić audyt wydajności Lighthouse i zwrócić uwagę na możliwości, które zostaną w jego wyniku wskazane.

Aby dowiedzieć się, jak ogólnie poprawić TTI (w przypadku dowolnej witryny), zapoznaj się z tymi przewodnikami dotyczącymi wydajności: