主页 / 问题 / 1147705
Accepted
Вася
Asked:2020-07-01 16:04:58 +0000 UTC2020-07-01 16:04:58 +0000 UTC

如何解决 Pagespeed 错误“不使用被动事件侦听器来提高滚动性能”

  • 772

在使用Google Pagespeed优化网站时，我遇到了一个问题，该问题谷歌页面速度问题导致页面解释您需要在鼠标滚轮滚动事件和触摸事件中使用被动模式。

document.addEventListener('touchstart', onTouchStart, {passive: true});

我在网站上使用jquery.ui.touch-punch.js库，但我不知道将属性放在哪里passive: true

javascript

1 个回答

  1. Best Answer

    WordPress 的代码在这里有所帮助。

    //Пассивные прослушиватели событий не используются для улучшения производительности при прокрутке
//© Калинский Евгений aka seojacky (https://t.me/big_jacky)
add_action( 'wp_footer', 'script_passive_event_listeners', 99 );
function script_passive_event_listeners(){
    ?>
<script>
(function() {
  var supportsPassive = eventListenerOptionsSupported();  

  if (supportsPassive) {
    var addEvent = EventTarget.prototype.addEventListener;
    overwriteAddEvent(addEvent);
  }

  function overwriteAddEvent(superMethod) {
    var defaultOptions = {
      passive: true,
      capture: false
    };

    EventTarget.prototype.addEventListener = function(type, listener, options) {
      var usesListenerOptions = typeof options === 'object';
      var useCapture = usesListenerOptions ? options.capture : options;

      options = usesListenerOptions ? options : {};
      options.passive = options.passive !== undefined ? options.passive : defaultOptions.passive;
      options.capture = useCapture !== undefined ? useCapture : defaultOptions.capture;

      superMethod.call(this, type, listener, options);
    };
  }

  function eventListenerOptionsSupported() {
    var supported = false;
    try {
      var opts = Object.defineProperty({}, 'passive', {
        get: function() {
          supported = true;
        }
      });
      window.addEventListener("test", null, opts);
    } catch (e) {}

    return supported;
  }
})();
</script>
    <?php
}

    • 1

相关问题