Forums

CMS / Theme Optimization

Permalink
Hey Concrete5 Community,

I'm trying to reduce the requests and improve the overall performance. Also one of the goals is to reach a Google Page Insights score above 80. To reach this I use a default demo Installation while optimizing the server and Elemental Theme.

Sadly I've reached some kind of concrete wall now, as the system "forces" me to use 3 different CSS files (main, font-awesome and some generated overlay css). Is there any way to merge and minify those?

Also one of the stylesheets is included after the js scripts.

Where can I edit those <head> tags? Or in other words is it even save to edit those in terms of updates etc.

Link:http://concrete5.initart.org
GTMetrix:https://gtmetrix.com/reports/concrete5.initart.org/86f0Gc4W...
Page Insights:https://developers.google.com/speed/pagespeed/insights/?url=http%3A%...
 
MrKDilkington replied on at Permalink Reply
MrKDilkington
Hi Slaymane,

At 15 requests for your home page, that is very reasonable. I don't imagine a huge leap in performance by reducing the requests by 2 (or 3).

I am not saying that all of the CSS can't be combined, it probably can. Just that the effort to do it would not be worth the time involved.

One thing that could be done to benefit rendering speed, would be to move font-awesome.css from the header into the end of the body. It would reduce render blocking round trips caused by the 64KB font file. I have not moved Font Awesome into the body before, but it is something I need to look into.

If you don't use blocks that use Font Awesome (e.g. Social Links, Search, Feature), then the Font Awesome asset can be removed from page_theme.php as a requirement .
$this->requireAsset('css', 'font-awesome');

If you only need a few icons, you can replace them with data-URI/image/SVG replacements.
Slaymane replied on at Permalink Reply
Hey MrKDilkington,

in terms of performance I'm pretty impressed already, its just that some people want to see that green score on Page Inisghts. The other sugesstions from GTMetrix can easily be achieved I think.

Should be fine if I just merge block / font-awesome into the main stylesheet, should be no problem with less.css.

Thanks for your help! :)