Eliminate render-blocking resources - Page Speed Mobile

@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.

4 Likes