Anyone encountering this issue with Google PageSpeed ?
How is it fixed.
Possible Optimizations
Eliminate render-blocking JavaScript and CSS in above-the-fold content
Your page has 1 blocking script resources and 4 blocking CSS resources. This causes a delay in rendering your page.
None of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.
webfont.js has to be in the <head> to reduce the FOUC. You can easily remove that error by not using a webfont (Typekit, Google Font). That script isn’t Webflow specific, but user-opt-in when they decide to use a Typekit or Google Font.
Again, I’m not quite sure what the fixation is on Google Page Speed. It’s purely heuristic based, and the score has zero bearing on how your page actually loads, or how it ranks in SEO.
Could you help me understand a bit more what your concerns are?
Try plugging in different Google sites into Page Speed Insights and demonstrate to the client that even Google themselves don’t always follow their own “insights”.
I read the CTO writeup, and I understand that Pagespeed score is not having an effect on my sites’ speed, but it is a factor that clients have asked about, especially when coming from Wordpress (with plenty of ways to achieve a high score).
I hate to compare to Wordpress…but is there a way we could explain to them why it doesn’t matter to have a low Pagespeed score?
I believe it can help to get some more point in PageSpeed Insights, but there can raise some issues with FOUT/FOIC in browsers.
As @PixelGeek mentioned - there is no sense in reach such 100/100 in most cases)
I’d recomend to have some additional tests with tools like Pingdom FullPageTest or WebPageTest - to see what’s really matters and affects load time most significantly.
Plus if you are serious about pagespeed, you would need to look into SSR/CSR HTTP2.0 anyway. For instant loading, just add sw-precache.
Also, find out whatever makes up your app shell (like navbar & Co) and put it in the head of your document, lazyload the rest.
Keep file sizes to a minimum, don’t load scripts where they aren’t needed and if, async/lazyload.
Dont forget to minify and gzip them boys as well.
If you want to get serious with speed, you should probably also get started with something like fiddler, though this tool is very useful for many more cases and for web devs in general.
