Added passive parameter for addEventListener.

[kulak-at]

Added {passive: true} parameter for all addEventListener calls that does not call e.preventDefault(). It should increase performance, I've noticed huge performance increase in my project.

Documentation reference: https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

[rfabes21]

@janpaepke Looking for an update for on this, it's been months and I haven't seen any official word on whether this support was going to be added.

[gil--]

Thanks for this.

[iranreyes]

Hi @kulak-at,

Include this feature will be great in terms of performance. My only recommendation is to include the polyfill for the passive instead of use it directly.

This can be quickly achieve it if a module is created exporting a usePassiveEvent() function with the right return.

Module

let alreadyTested = false;
let passiveSupported = false;

function isSupported() {
  if (alreadyTested) {
    return passiveSupported;
  } else {
    alreadyTested = true;

    // Test via a getter in the options object to see if the passive property is accessed
    try {
      var opts = Object.defineProperty({}, 'passive', {
        get: function() {
          passiveSupported = true;
        }
      });
      window.addEventListener('test', null, opts);
    } catch (e) {}
    return passiveSupported;
  }
}

export default function usePassiveEvent() {
  return isSupported() ? { passive: true } : false;
}

Use of the module

import usePassiveEvent from '../../util/usePassiveEvent.js';

window.addEventListener('scroll', this.handleScroll, usePassiveEvent());

[morgano86]

Any update on this?

[jeremyzahner]

Ping @janpaepke

[janpaepke]

@iranreyes sounds solid. could you send a pr?

[adambateman]

Would be great to see this merged in. Seems like such an easy win and it's picked up during site audits with Google lighthouse.

[notbear]

Hi @kulak-at
Would you mind updating your PR? ScrollMagic really deserves for your fix.

[codesimon]

Any progress on this @kulak-at?