Scrollmagic: Warning: non-passive event listener to a scroll-blocking 'mousewheel' event

Created on 20 Apr 2018  路  6Comments  路  Source: janpaepke/ScrollMagic

[Violation] Added non-passive event listener to a scroll-blocking 'mousewheel' event. Consider marking event handler as 'passive' to make the page more responsive.

Most helpful comment

I was able to fix this using the guide here to check if passive is supported and then add the passive flag to each addEventListener in ScrollMagic.js as shown in their example, i.e.

window.addEventListener("mousewheel", function () {}, passiveSupported ? { passive: true } : false);

All 6 comments

Any solution for this so far @janat08 ? Running into the same issue with React 16.3. Initializing ScrollMagic in componentDidMount() (which was worked thus far).

no

I was able to fix this using the guide here to check if passive is supported and then add the passive flag to each addEventListener in ScrollMagic.js as shown in their example, i.e.

window.addEventListener("mousewheel", function () {}, passiveSupported ? { passive: true } : false);

@melpers This would be such an easy performance fix, could you create a pull request?

@melpers Would you be able to post a link to the new SM file you use that incorporates passive event listeners?

I can't post a link as the site that was using it was taken down and the repo is private. However, I dug up a copy of it and am attaching it here. YMMV.
ScrollMagic_passive_patched.js.zip

Was this page helpful?
0 / 5 - 0 ratings

Related issues

neversion picture neversion  路  4Comments

Paulimausi picture Paulimausi  路  7Comments

pascaloliv picture pascaloliv  路  3Comments

house8 picture house8  路  5Comments

ch3rr1 picture ch3rr1  路  4Comments