Szacowany czas oczekiwania na wprowadzenie danych

Szacowane opóźnienie wprowadzania danych to jeden z 6 rodzajów danych śledzonych w sekcji Wydajność raportu Lighthouse. Każda wartość odzwierciedla określony aspekt szybkości wczytywania strony.

Raporty Lighthouse pokazują szacowany czas oczekiwania na przetwarzanie danych w milisekundach:

Zrzut ekranu z kontroli szacowanego czasu oczekiwania na przetwarzanie danych w Lighthouse

Co mierzy szacowane opóźnienie wprowadzania danych

Szacowane opóźnienie reakcji to szacowany czas reakcji aplikacji na dane wejściowe użytkownika podczas najbardziej intensywnego, 5-sekundowego okna wczytywania strony. Czas kontroli biegnie od pierwszego znaczącego wyrenderowania do końca logu czasu, czyli około 5 sekund po czasie do pełnej interaktywności. Jeśli opóźnienie jest większe niż 50 ms, użytkownicy mogą uznać aplikację za powolną.

Model wydajności RAIL zaleca, aby aplikacje odpowiadały na dane wejściowe użytkownika w ciągu 100 ms, a docelowy szacowany czas oczekiwania na dane wejściowe w Lighthouse to 50 ms. Dlaczego? Lighthouse korzysta z danych proxy – dostępności wątku głównego – do mierzenia, jak dobrze aplikacja reaguje na działania użytkownika.

Przyjmuje się, że aplikacja potrzebuje 50 ms na pełną reakcję na dane wejściowe użytkownika (od wykonania dowolnego JavaScriptu po fizyczne umieszczenie nowych pikseli na ekranie). Jeśli wątek główny jest niedostępny przez co najmniej 50 ms, jest to zbyt mało czasu, aby aplikacja mogła odpowiedzieć.

Około 90% użytkowników napotka zgłaszane opóźnienia w danych wejściowych, które są zgłaszane przez narzędzie Lighthouse. 10% użytkowników może spodziewać się większych opóźnień.

Jak poprawić wynik przewidywanego czasu oczekiwania

Aby aplikacja szybciej reagowała na dane wprowadzane przez użytkownika, zoptymalizuj sposób działania kodu w przeglądarce. Zapoznaj się z serią technik opisanych na stronie Google Wydajność renderowania. Mogą one dotyczyć odciążania zasobów obliczeniowych od pracowników sieciowych, aby zwolnić wątek główny, refaktoryzacji selektorów arkusza CSS, aby wykonywać mniej obliczeń, po wykorzystanie właściwości CSS, które minimalizują ilość operacji intensywnie korzystających z przeglądarki.

Jak ręcznie mierzyć szacowane opóźnienie wprowadzania danych

Aby ręcznie mierzyć szacowane opóźnienie wprowadzania danych, utwórz nagranie za pomocą osi czasu Narzędzi deweloperskich w Chrome. Przykładowy przepływ pracy znajdziesz w sekcji Mniej pracy z wątkiem głównym. Podstawowym założeniem jest rozpoczęcie nagrywania, wykonanie działań użytkownika, które chcesz zmierzyć, zatrzymanie nagrywania, a następnie przeanalizowanie wykresu płomieniowego, aby upewnić się, że wszystkie etapy potoku piksela zakończą się w ciągu 50 ms.

Zasoby