Regarding: Does not use passive listeners to improve scrolling performance

Hi!

When I check our website: https:///www.parfymonline.se in Google Page Speed Insights I get this warning:

Does not use passive listeners to improve scrolling performance
https://ajax.cloudflare.com/cdn-cgi/scripts/7d0fa10a/cloudflare-static/rocket-loader.min.js

Is there anyway to sort this out? How much does it actually affect load time?

Grateful for any feedback regarding this!

Best Regards
Andreas

So that notice is being triggered for the Cloudflare Rocket Loader feature - you can disable this in the Speed tab of your Cloudflare dashboard.

That said, Rocket Loader should only add event listeners if the Javascript running on your website requires them - so when you disable Rocket Loader, you may find that the notice pinpoints the exact script - which you’ll need to address in your website’s code.

I tried disabling Rocket Loader, the notice just turned Green instead and no more info.

However I do see a difference in load speed both thru waterfall in browser and thru ping doom tools, so obviously the function does what it promises. So Perhaps I should just ignore this warning thru Page Insights by Google !?

I ignore it, but after reading Simon’s link I may try to track down which JS is doing this and add the passive flag.

EDIT: I don’t use Rocket Loader, so that warning is definitely coming from my sites’ JS.

I may well be wrong… but from memory Rocket Loader really only “proxies” event listeners - e.g. it adds things that your site’s underlying JS are using. There are likely some fairly limited things it needs to add for its own purposes - so if disabling Rocket Loader makes that notice disappear, let me know and I can raise it internally.

I can confirm that the notice went from red to green after disabling the rocket loader. Or could it be that the JS that has the error, actually isn’t loading on the startpage, but when activating Rocket Loader, it picks it up nonetheless. So maybe I need to disable it and browse more pages to be certain.

1 Like

I’m not sure how Rocket Loader works but Simon mentions it only adds the listener if your underlying JS does so.

In any case, I think your site is using a jQuery scroll event listener, possibly to hide the top bar of the header when you scroll the page?
As far as I know jQuery scroll events are not passive but it’s a pretty easy fix.
Instead of using the jQuery event:

$(window).scroll()…

replace it with native JS:

document.addEventListener(‘scroll’, (evt) => {

then you can add the “passive: true” parameter at the end.

That should fix the issue if Rocketloader is reacting to that event handler but as I said, I have no idea how RL works.

  • Scott
1 Like

This topic was automatically closed 3 days after the last reply. New replies are no longer allowed.