: When is eliminating render-blocking CSS worth it? We wanted to follow the PageSpeed Insights CSS recommendations and separate critical and deferred CSS. To that end we read lots of posts and
We wanted to follow the PageSpeed Insights CSS recommendations and separate critical and deferred CSS. To that end we read lots of posts and recommendations, such as Optimize CSS Delivery and Eliminate render blocking css.
Just to test what difference it makes we moved the bundle to the bottom of the page. The result was it made no difference whatsoever. We still got the exact same score and the same "Eliminate render-blocking JavaScript and CSS in above-the-fold content" problem for this bundle (why when it's loaded last??).
We also started separating the CSS physically, but quickly came to the conclusion that if we do it in a way that all pages show correct above-the fold content, about 70% of the CSS would need to go inline, leaving only about 30% deferred.
Having a large portion of the CSS inline doesn't seem to make much sense, so we wonder if we can ignore the PageSpeed Insights suggestion without too much ranking penalty. At present, how much SEO difference does fixing this issue really make and is it worth the effort for a site with several different page layouts (different categories each have their own layout)?
More posts by @Yeniel560
1 Comments
Sorted by latest first Latest Oldest Best
What "bundle" did you move to the bottom of the page? You can only do that with javascript.
You start inserting above the fold CSS when it makes a measurable difference. Is inserting the CSS making the page display faster than round-tripping a CSS file? You might look into why 70% of your CSS is being applied to the top of your page.
Then again, a lot of recommendations by Google, and others, are for large sites with large pages and megabyte files; something to keep in mind. The documentation won't always state exceptions.
I believe that the PageSpeed statement is a blanket one; you can have perfect CSS but, if your javascript slows things down, you'll get the same statement. CSS files will always block.
The best thing to follow is the network and timing tabs in your browser's developer tools.
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.