Odbiorniki zdarzeń dotykowych i z kółka są przydatne do śledzenia interakcji użytkowników i tworzenia niestandardowych sposobów przewijania, ale mogą też opóźniać przewijanie strony. Obecnie przeglądarki nie wiedzą, czy odbiorca zdarzeń będzie blokować przewijanie, dlatego zawsze czekają na zakończenie działania odbiornika, zanim przewiną stronę. Pasywne detektory zdarzeń rozwiązują ten problem, ponieważ pozwalają wskazać, że detektor zdarzeń nigdy nie będzie blokował przewijania.
Zgodność z przeglądarką
Większość przeglądarek obsługuje pasywne detektory zdarzeń. Zgodność z przeglądarką
Dlaczego audyt pasywnego detektora zdarzeń w Lighthouse kończy się niepowodzeniem
Lighthouseflaguje detektory zdarzeń, które mogą opóźniać przewijanie strony:
Lighthouse używa tego procesu do identyfikowania detektorów zdarzeń, które mogą wpływać na wydajność przewijania:
- Zbierz wszystkie detektory zdarzeń na stronie.
- Odfiltruj detektory, które nie są dotykowe lub nie działają na kółku.
- Odfiltrowywanie detektorów wywołujących funkcję
preventDefault(). - odfiltrowywać słuchaczy, którzy pochodzą z innego hosta niż strona.
Lighthouse odfiltrowuje słuchaczy z różnych hostów, ponieważ prawdopodobnie nie masz kontroli nad tymi skryptami. Mogą występować skrypty innych firm, które pogarszają działanie strony podczas przewijania, ale nie są wymienione w raporcie Lighthouse.
Jak uczynić detektory zdarzeń pasywnymi, aby poprawić działanie przewijania
Dodaj flagę passive do każdego wykrytego przez Lighthouse odbiornika zdarzeń.
Jeśli korzystasz tylko z przeglądarek, które obsługują pasywny detektor zdarzeń, po prostu dodać flagę. Na przykład:
document.addEventListener('touchstart', onTouchStart, {passive: true});
Jeśli korzystasz ze starszych przeglądarek, które nie obsługują pasywnych detektorów zdarzeń, musisz użyć wykrywania funkcji lub kodu polyfill. Zobacz Wykrywanie funkcji sekcji pasywnych detektorów zdarzeń WICG. z wyjaśnieniem, aby uzyskać więcej informacji.