什么是被动事件监听器?

发布于 2021-02-02 17:16:20

在努力提高渐进式Web应用程序的性能时,我遇到了一项新功能Passive Event Listeners,但我很难理解这一概念。

Passive Event Listeners在我们的项目中有什么以及有什么需要?

关注者
0
被浏览
181
1 个回答
  • 面试哥
    面试哥 2021-02-02
    为面试而生,有面试问题,就找面试哥。

    被动事件侦听器是一种新兴的网络标准,是Chrome51附带的一项新功能,可极大提高滚动性能。

    通过消除滚动以阻止触摸和滚轮事件监听器的需求,它使开发人员可以选择更好的滚动性能。

    问题:
    所有现代浏览器都具有线程化滚动功能,即使在运行昂贵的JavaScript时,滚动操作也可以平稳运行,但是这种优化由于需要等待任何touchstarttouchmove处理程序的结果而被部分挫败,这可能会通过调用来完全阻止滚动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);
    


推荐阅读
知识点
面圈网VIP题库

面圈网VIP题库全新上线,海量真题题库资源。 90大类考试,超10万份考试真题开放下载啦

去下载看看