Optimize your critical rendering path
CSSVacuum is a tool to help you determine what CSS is 'critical', or above the fold. Google is recommending critical CSS be placed above the fold (https://docs.google.com/presentation/d/1IRHyU7_crIiCjl0Gvue0WY3eY_eYvFQvSfwQouW9368/present#slide=id.p19), and this plugin helps with that. CSSVacuum finds elements that are above the fold, matches against all CSS classes, and regenerates CSS based on what is relevant (for you to copy and paste into header, or just look at when creating your critical.css file). It is a tool to aid with development, and does not yet product 100% production grade CSS. Please contribute at https://github.com/ndreckshage/CSSVacuum.
- (2017-07-19) Ray Foss: you have to add '?CSSVacuum' to the url manually, but once you do it'll unstyle the page. Youll have to manually inline the css it provides in a style tag to see its results.
- (2016-01-05) Aaron T. Grogg: The process is a little clunky (manually adding a querystring to the URL), and the resulting CSS was for small screens, which makes large screens look odd and generates a repaint when the CSS file is appended. It would work well for small screens, though. Atg