I have this website, that I think loads really fast and is nicely optimized, but whenever I run it through PageSpeed, it receives a horrible score on Mobile only?
With “Minimize main thread work” being the main one, spending allegedly 124 seconds on Rendering?
I’ve tried debugging it in DevTools, with the Performance tab, but even with CPU slowdown and slow 3G, I can’t get it to show any problems. The long tasks in the screenshot are all related to Extensions I have installed in Chrome.
The JavaScript is run through Babel with the “@babel/preset-env” preset and then minified afterwards.
Advertisement
Answer
For anyone wondering, this is what threw PageSpeed off:
.hero-image.animated { animation: animatedBackground var(--hero-animated-duration) linear; background-position: bottom right; }
Removing the animation, fixed the issue with mobile pages scoring really low.