什么是被动事件监听器？

Question

在努力提高渐进式网络应用程序的性能的同时,我遇到了一个新功能Passive Event Listeners,我发现很难理解这个概念.

什么是Passive Event Listeners,什么是需要有它在我们的项目？

Answer 1

被动事件监听器是一种新兴的Web标准,Chrome 51中提供的新功能为滚动性能提供了重要的潜在推动力.Chrome发行说明.

它使开发人员能够通过消除在触摸和滚轮事件监听器上滚动阻止的需要来选择更好地滚动性能.

问题:所有现代浏览器都有一个线程滚动功能,即使在运行昂贵的JavaScript时也允许滚动顺利运行,但是这种优化部分地被需要等待任何touchstart和touchmove处理程序的结果所打败,这可能会通过调用完全阻止滚动preventDefault()在这个事件上.

解: {passive: true}

通过将触摸或轮子监听器标记为被动,开发人员承诺处理程序不会调用preventDefault禁用滚动.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规范 , 演示视频 ,解释器文档