re. the jQuery reference error; the ecwid-frontend-js file is minified by AO but it is also being asynced (by AsyncJS?) while jQuery is being deferred. the problem is that the asynced files execute before deferred ones, so the ecwid gets runned but does not “find” jQuery and produces the error. you’ll have to make sure that either ecwid-JS is deferred iso asynced OR exclude jQuery from being deferred.
re. unused CSS; it is being reported as being Autoptimize’s, but AO merely aggregates and minifies all the CSS provided by your theme & plugins and does not know which CSS is used or not used and hance cannot remove anything. There however is a new premium service that can remove unused CSS that could help. For more info see the Rapidload entry on Autoptimize’s “Optimize More” tab.
having legacy JS is normal I’m afraid; all the JS a site has logic to make it work accross a range of browsers (new and older) and that means some “legacy” code is in there. autoptimize then just optimizes that code but it cannot know which code is needed and which is not 🙂
hope this helps,
frank
Thank you Frank. Excuse my ignorance but where can I find the url to the ecwid js file? And once found can I include that in the Scripts to Defer section of Async Javascript? Or it’s not as simple as that? (Probably not ;))
hmmm .. if I were you I would disable AsyncJS (at least for now) and test if that fixes the async vs defer issue. based on the outcome we can tweak settings either in AO or AsyncJS further (if needed).
Hi Frank, thank you for getting back to me. I disabled AsyncJS as suggested and you are right, it has got rid of that error under Best Practices for both mobile and desktop so now both have a score of 100, but the Performance scores have now dipped
https://pagespeed.web.dev/analysis/https-reclaimdesign-org/kx0qlmtz2t?form_factor=desktop
try disabling “aggregate javascript” and instead use “don’t aggregate but defer” and “also aggregate inline javascript”, you may be able to remove all JS optimization exclusions even 🙂
Thank you for your help Frank. I’ve made those changes as suggested and run the page speed test a couple of times, and the performance has gone up which is amazing, thank you. But for some reason I don’t understand on mobile it says “Eliminate render-blocking resources Potential savings of 200 ms” and it points to
…jquery/jquery.min.js?ver=3.7.1
I also don’t understand why the performance scores seems to fluctuate quite a lot when I rerun the test – is that something to do with the web host more than anything else?
try activating the “Disable extra compatibility logic?” option at the bottom of AO’s main settings page, but do test your site to make sure nothing breaks that way! 🙂
Thank you Frank, I’ve unchecked the extra compatibility logic option and rerun the tests, but for some reason it still complains about https://reclaimdesign.org/wp-includes/js/jquery/jquery.min.js?ver=3.7.1
And I wanted to ask if there is a way I can include this google tag manager script (https://www.googletagmanager.com/gtag/js?id=G-RE9HBZ8ZR2) in the defer process as this seems to always flag the Reduce unused JavaScript warning?
I have emptied the cache for autoptimize and also the EasyWP one
if (a) the JS opt. exclusion field is empty and (b) compatiblity logic is disabled, then something else (plugin or theme) is using AO’s API to exclude jQuery from being deferred I’m afraid and that is unlikely to be something you change.
you could try identifying the culprit by disabling/ enabling plugins one at a time and/ or briefly switching themes (and with each test clear any page cache you might have)?
OR .. you could re-enable AsyncJS and set all to be deferred, that might work as well 🙂
Thank you Frank. I will try that too
