Rocket Loader Issues (Use Passive Listeners To Improve Scrolling Performance)

Can someone help me solve the problem on my site rajatips? I’ve lost focus on fiddling with wordpress

First, I saw info on a blog that activating the rocket loader has a good impact on website performance

Then I activated it, and I did a test using the Lighthouse extension. Then I saw the warning “Does not use passive listeners to improve scrolling performance”, “Consider marking your touch and wheel event listeners as passive to improve your page’s scroll performance.”

I tried to browse and find a solution, but I’m still new in this field, so I haven’t found a solution yet.

I tried one of the jquery that was voted on by many people, something like this:

jQuery.event.special.touchstart = {
    setup: function( _, ns, handle ) {
        this.addEventListener("touchstart", handle, { passive: !ns.includes("noPreventDefault") });
    }
};
jQuery.event.special.touchmove = {
    setup: function( _, ns, handle ) {
        this.addEventListener("touchmove", handle, { passive: !ns.includes("noPreventDefault") });
    }
};
jQuery.event.special.wheel = {
    setup: function( _, ns, handle ){
        this.addEventListener("wheel", handle, { passive: true });
    }
};
jQuery.event.special.mousewheel = {
    setup: function( _, ns, handle ){
        this.addEventListener("mousewheel", handle, { passive: true });
    }
};

I also tried to put the script in header.php, but the code instead appears on the website:

I tried to put it in function.php, but the changes can’t be saved

What should I do to solve this problem? But still activate the Rocket Loader? Thanks :pray:

This will never work with Rocketloader. What RocketLoader does is stopping/blocking the rendering, like nearly every JS and restructuring it so be optimized. This would not work if executed as a passive eventlistener. It would be less renderblocking but then RocketLoader would have no effect I guess since the rendering is not blocked for its time of optimizing and therefore the unoptimized page will be rendered.

I guess thats the main problem here. Wordpress really isn’t made to perform top, specially if you use a lot of plugins. Yes Rocketloader can do something to conceal that, but at a cost of renderblocking. Thats why you get that message.

What does the Rocketloader renderblocking this have to do with your actuall mousewheel event? The message states, that renderblocking could impact this event, but not that the this event therefore should be set as a passive eventlistener.

This is JavaScript, of course you can’t put plain JS into a PHP file and expect it to work just like that. … I think you don’t know what you are doing here.
If you want JS to be implemented with PHP then surround it with a JavaScript tag (<sсript>). Otherwise the code itself will be rendered as text, like shown in your screenshot.

There is an error message which tells you what is wrong with this. But again you try to put plain JS into PHP.

three options:

  1. deactivate RocketLoader since it was designed to compensate all of your unoptimized things with renderblocking. So renderblocking is what you get, since it is not solving the problem but rather concealing it.
  2. deal with it. Since I can’t see how much renderblocking it produces it may could be just a little. Even if its a lot of renderblocking compare your scores to not having RocketLoader. If you have better scores with Rocketloader. Then why you mind the renderblocking, since RocketLoader improved your page over all.
  3. optimize your page natively so you dont have to go with js based, clientsided optimization-plugins/technics which are the worst of all optimizations. Still, they are better then not having any optimization.

I would go with #3 but thats the thing that requires the most knowledge.

2 Likes

Wow, I never got this detailed answer, thanks a lot. I got a lot of enlightenment

Yes, I’m sorry, I forgot one thing, which is writing code wrapped in a javascript tag. I completely lost focus

OK, thank you very much again. It really helped me to decide what I should do. If I don’t get this answer I’ll probably keep looking for an answer to keep using Rocket Loader without running into those warnings, it’s a never-ending fallacy, lol.

And one thing, sorry if my english is messy :sweat_smile:

Oh yes, there is one thing that still worries me, because it is explained in the description that activating Rocket Loader is one of the things that can make a website rank well.

Now if the condition is like my website, I want to know is it better to use rocket loader or not?

For me, it’s fine to get a warning like that but the rankings have really improved. I want to hear from you, thank you

Dont worry, this community is not about correct grammar, it’s about helping people :slight_smile:

It’s very simple to find out. Please do this:

  1. Test your page with RocketLoader on
    1.1. Google PageSpeed insights
    1.2. GTmetrix
  2. Test your page without RocketLoader on
    2.1. Google PageSpeed insights
    2.2. GTmetrix

Then post the results here (for Google PageSpeed Insights please screenshots) so we can compare them an decide what is better for your page.

1 Like

Ok, I got it. Thank you very much for taking the time to answer this question. Have a good days

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