Hi! I have a problem with my “Page Speed”. I don’t understand what I should do with this information…
" Eliminate render-blocking resources
Resources are blocking the first paint of your page. Consider delivering critical JS/CSS inline and deferring all non-critical JS/styles. Learn more.
(uploads-ssl.webflow.com)|18.9 KiB|930 ms|"
I hope someone knows this
Sending my regards from Sweden
Here is my site Read-Only: LINK
(how to share your site Read-Only link)
Not everything recommended you can address. This is one of those.
it’s true webflow does not allow us to address this but you guys could address it on your end. Is this something being looked into? I also get less than ideal mobile results on page speed and have no ability to fix the issues in Webflow.
bump @Waldo is there anything to add on this or is it being looked into do you know?
I think Webflow allows to defer and async, and thus solve the problem in the topic, but only after exporting code out of Webflow.
I think it should be possible to deal with it with an additional tool that analyzes the CSS file. Friend suggested to me, that he had once a tool which suggested which CSS classes or selectors should be looked into. Then, it is the matter of logging into Styles Manager in Webflow and checking them manually. Do you perhaps know the name of this tool? I’ve been looking for it to no avail. Have seen it a few years ago.
Any updates on this? Webflow team?
@webdev currently with recent Google Page Speed updates it’s becoming a lot more of an issue, because css request is blocking.
I realize obvious things are done - minify, serve from CDN, one file, etc…
You could go much further:
- Automatically purge unused classes
- Automatically break down CSS into site specific and files common to each page
- Break down into files by media queries as explained here Render Blocking CSS
Then minimum amount of CSS would load and that would mean less time loading and less time processing rules on slower mobiles on slower networks
I understand you keep it render blocking to avoid a flash of unstyled content and it’s great. However, all modern frameworks, like Gatsby, next, anything with webpack, already produce optimized css for each page that dynamically loads.
These are the suggested fixes for my mobile site - 4 out of 5 items can only be addressed by webflow My SEO is really suffering so any advice would be much appreciated.
Also keen to understand how to fix this issue - or how Webflow are thinking about addressing it.
I come from JAMStack, we moved from there to Webflow because of scaleability issues with designers…it’s great to not have to deal with backend…but not seeing them implement best practices like purging unused CSS (stuff Bootstrap and Tailwind does) is sad.
Why not just in-line the CSS, that’s wouldn’t that solve the problem: “Consider delivering critical JS/CSS inline and deferring all non-critical JS/styles.”
Any solution? It is making my lcp take 2.5 seconds and I my score is almost perfect other than this.
Having a major issue with this on my site as well. Everything is pretty much perfect apart from the render blocking issue which takes 1.7 seconds(???). Craziness - hope there is a fix soon otherwise I’ll need to think about self-hosting
I work as a mobile web developer. For me, perceived speed is a huge issue. For the time being, backend constraints prevent me from breaking out JS and CSS in this manner. Icons were one area where I did have more control. We use FontAwesome, and because of the way we defer webfonts, it’s one of the last things rendered. This looks bad because the icons on our burger, cart, and search buttons appear after everything else. It’s startling. I despised it so much that I converted each glyph to SVG, hand-optimized them to remove unnecessary detail, and in-lined them in markup instead.
They’ve gone from being the very last to load to appearing instantly when the DOM is painted for the first time. It vastly improves the user experience while having virtually no effect on load time. It took some effort to establish a good workflow, and I understand that it may not be a viable option for some people, but I wouldn’t do it any other way now.