Co to są pasywni nasłuchujący zdarzeń?

Pracując nad zwiększeniem wydajności progresywnych aplikacji internetowych, natknąłem się na nową funkcję Passive Event Listenersi trudno mi zrozumieć tę koncepcję.

Jakie są Passive Event Listenersi jakie są potrzeby, aby mieć to w naszych projektach?

Pasywne nasłuchiwanie zdarzeń to wyłaniający się standard sieciowy, nowa funkcja dostępna w Chrome 51, która zapewnia znaczny potencjalny wzrost wydajności przewijania. Informacje o wersji Chrome.

Umożliwia programistom wybranie lepszej wydajności przewijania, eliminując potrzebę przewijania w celu zablokowania słuchaczy zdarzeń za pomocą dotyku i kółka.

Problem: Wszystkie nowoczesne przeglądarki mają funkcję przewijania w wątkach, która umożliwia płynne przewijanie nawet wtedy, gdy działa kosztowny JavaScript, ale ta optymalizacja jest częściowo pokonana przez konieczność oczekiwania na wyniki któregokolwiek touchstarti programów touchmoveobsługi, co może całkowicie uniemożliwić przewijanie, wywołując preventDefault()na wydarzeniu.

Rozwiązanie: {passive: true}

Oznaczając odbiornik dotyku lub kółka jako pasywny, programista obiecuje, że program obsługi nie będzie wywoływał funkcji preventDefaultprzewijania. This frees the browser up to respond to scrolling immediately without waiting for JavaScript, thus ensuring a reliably smooth scrolling experience for the user.

document.addEventListener("touchstart", function(e) {
    console.log(e.defaultPrevented);  // will be false
    e.preventDefault();   // does nothing since the listener is passive
    console.log(e.defaultPrevented);  // still false
}, Modernizr.passiveeventlisteners ? {passive: true} : false);

DOM Spec , Demo Video , Explainer Doc