I recently got this theme and deployed to a website.
I noticed that the site was taking too much time to load. Even with Autoptimize inline CSS and the proper optimizations.
When I extracted the CSS into a file I noticed the size is 1.5MB!!!
No wonder this site is so slow. When the average CSS standard size is 75KB.
Please let me know how I can reduce this CSS. I think it has a lot of things that I don’t need and are there who knows for what.
I disabled Autoptimize and it loads faster. I find this strange.
Average size for a complex theme is actually about 550KB these days as it combines multiple sizes, shapes, options, layouts, mobile/responsive, etc.
Visual composer is also a bit big.
However the actual footprint is much smaller for web browser via gzip and also with caching in the cloud (e.g., Chrome will cache your data if enough hits come from Chrome users, etc.).
You can also manually “minify” the main CSS file using the tips/tricks from my sticky post on site optimization.
But yes, it’s a bit big for all those features people have asked for (demanded?) — so, there is a lot going on, but it’s better than loading 10 diff. CSS files as it’s actually more efficient for one “packet” …
and some data is actually inlined automatically to help with pagespeed/rating.
There was a post exchange a while back for v4 where I’d asked about what we could “take out” if not using bbpress, woocommerce, multisite, or other things to “trim it” and that would be a good tutorial for Radu or somebody to tackle in a
“what can I take out of the main CSS file”
“what can I take out of the main includes-functions file”
as those are the two big payloads other than visual composer.
Chris
Great answer. I saw your sticky post. It is very detailed.
It will be interesting to see how to remove stuff you don’t need from your CSS. In particular when people don’t use all the features like: bbpress, woocommerce, etc.
