Yesterday evening I released Autoptimize 2.1 and the first Power-Up to manage critical CSS has been made available as a optional service over at criticalcss.com. This short video explains some of the logic behind the Autoptimize Critical CSS Power-Up:
Render-blocking CSS in WordPress? Use http://bit.ly/AOcCSS instead.
But let’s not forget about Autoptimize 2.1! The new features include:
Autoptimize now appears in the admin-toolbar with an easy view on cache size and the possibility to purge the cache (thanks to Pablo Custo)
A “More Optimization”-tab is shown with info about optimization tools- and services.
settings-screen now accepts protocol-relative URL for CDN base URL
admin GUI updated and responsiveness added
If cache size becomes too big, a mail will be sent to the site admin
power-users can enable Autoptimize to pre-gzip the autoptimized files with a filter
new (smarter) defaults for JS and CSS optimization
Although excluding jQuery from autoptimization by default might seem counter-intuitive, the “smarter” defaults should allow more Autoptimize installs to work out-of-the-box (including on sites run by people who might not be inclined to troubleshoot/ reconfigure Autoptimize in the first place).
And thanks to the release I now have a better idea of the number of active installs (which wordpress.org lists as +100000); 2.1 was downloaded 3239 times yesterday evening and it is listed as running on 1.8% sites. Simple math learns that Autoptimize is currently active on approx. 180000 WordPress websites. Let’s aim for 200K by the end of 2016! :-)
So although I am taking things rather slowly, I am in fact still working on Power-Ups for Autoptimize, focusing on the one most people were asking for; critical CSS. The Critical CSS Power-Up will allow one to add “above the fold”-CSS for specific pages or types of pages.
The first screenshot shows the main screen (as a tab in Autoptimize), listing the pages for which Critical CSS is to be applied:
The second screenshot shows the “edit”-modal (which is almost the same when adding new rules) where you can choose what rule to create (based on URL or on WordPress Conditional Tag), the actual string from the URL or Conditional Tag and a textarea to copy/ paste the critical CSS:
The next step will be to contact people who already expressed interest in beta-testing Power-Ups, getting feedback from them to improve and hopefully make “Autoptimize Critical Css” available somewhere in Q3 2016 (but no promises, off course).