Os listeners de eventos de toque e de roda são úteis para rastrear interações do usuário e criar experiências de rolagem personalizadas, mas também podem atrasar a rolagem da página. No momento, os navegadores não sabem se um listener de eventos vai impedir a rolagem, então eles sempre aguardam a conclusão da execução do listener antes de rolar a página. Os listeners de eventos passivos resolvem esse problema permitindo que você indique que um listener de eventos nunca vai impedir a rolagem.
Compatibilidade com navegadores
A maioria dos navegadores é compatível com listeners de eventos passivos. Consulte Compatibilidade de navegadores
Como a auditoria do listener de eventos passivos do Lighthouse falha
O Lighthouse sinaliza listeners de eventos que podem atrasar a rolagem da página:

O Lighthouse usa o seguinte processo para identificar listeners de eventos que podem afetar o desempenho de rolagem:
- Colete todos os listeners de eventos na página.
- Filtre listeners que não são de toque nem de roda.
- Filtre os listeners que chamam
preventDefault()
. - Filtra listeners de um host diferente da página.
O Lighthouse filtra listeners de diferentes hosts porque provavelmente você não tem controle sobre esses scripts. Talvez haja scripts de terceiros prejudicando o desempenho de rolagem da sua página, mas eles não aparecem no relatório do Lighthouse.
Como tornar os listeners de eventos passivos para melhorar o desempenho de rolagem
Adicione uma flag passive
a cada listener de evento identificado pelo Lighthouse.
Se você só oferecer suporte a navegadores com listeners de eventos passivos, basta adicionar a flag. Exemplo:
document.addEventListener('touchstart', onTouchStart, {passive: true});
Se você estiver oferecendo suporte a navegadores mais antigos que não são compatíveis com listeners de eventos passivos, será necessário usar a detecção de recursos ou um polyfill. Consulte a seção Detecção de recursos do documento explicativo Listeners de eventos passivos do WICG para mais informações.