concrete5 page loading speeds, can they be optimized?
Permalink 2 users found helpful
Dear all,
I'm a complete newbie to concrete5, and I'm currently evaluating it for a small company run by a friend.
Looking at the page load time of concrete5.org itself and some of the sites showcases in the gallery, I noticed that they weren't necessarily that fast...
So, I tried making a quick performance test of a random page concrete5 page. (http://www.concrete5.org/about/advisors/)
This page loaded fairly fast, you can see the results here:
http://www.webpagetest.org/result/101210_2K8F/...
However, practically none of the content had proper caching headers, and many of the files could have been concatenated together to reduce HTTP requests. It could load significantly faster with a little optimization.
So, then I tried looking into the docs for tips on how to use an external Content Delivery Network with concrete5, and how to concatenate theme CSS files etc together. In other words, I tried to understand how to implement the Yahoo! "Server" performance best practices on a concrete5 platform:
http://developer.yahoo.com/performance/rules.html...
I found this:
http://www.concrete5.org/documentation/how-tos/five-easy-ways-to-sp...
It's a step in the right direction, but it doesn't excatly address what I'm looking for. I'm looking for:
- adding caching headers to all static (theme CSS, logo images etc) content.
- concatenating script files and JS files to reduce the number of HTTP requests.
- using an off-site Content Delivery Network for the above static content.
Can anyone point me in the right direction; are there some tutorials or tips somewhere I could read up on?
Thank you,
I'm a complete newbie to concrete5, and I'm currently evaluating it for a small company run by a friend.
Looking at the page load time of concrete5.org itself and some of the sites showcases in the gallery, I noticed that they weren't necessarily that fast...
So, I tried making a quick performance test of a random page concrete5 page. (http://www.concrete5.org/about/advisors/)
This page loaded fairly fast, you can see the results here:
http://www.webpagetest.org/result/101210_2K8F/...
However, practically none of the content had proper caching headers, and many of the files could have been concatenated together to reduce HTTP requests. It could load significantly faster with a little optimization.
So, then I tried looking into the docs for tips on how to use an external Content Delivery Network with concrete5, and how to concatenate theme CSS files etc together. In other words, I tried to understand how to implement the Yahoo! "Server" performance best practices on a concrete5 platform:
http://developer.yahoo.com/performance/rules.html...
I found this:
http://www.concrete5.org/documentation/how-tos/five-easy-ways-to-sp...
It's a step in the right direction, but it doesn't excatly address what I'm looking for. I'm looking for:
- adding caching headers to all static (theme CSS, logo images etc) content.
- concatenating script files and JS files to reduce the number of HTTP requests.
- using an off-site Content Delivery Network for the above static content.
Can anyone point me in the right direction; are there some tutorials or tips somewhere I could read up on?
Thank you,
I'm with you. Concrete5 makes a large number of http requests, all of which could easily be condensed by concatenating script files behind the scenes. Although combining and compressing js/css during development is not feasible, it's certainly something nice to have turned on by a super cache for any other time. Anyone have any news as to whether this is part of the plans for a super cache in a next release?
concrete5.org is running version 5.4.0.6, pull page caching was implemented in 5.4.1, the site will be upgraded soon, but everything has to be tested first,
Sorry, meant, the CMS in general and not the .org. Full page caching works well and definitely makes a difference, but the large number of http requests remain. I'm curious if there's any plans to implement a overdrive cache of sorts that compresses and concatenates all the css and js scripts.
in the future hopefully,
an addon could probably do it,
but, in the meantime, take a look at the apache extension
mod_page_speed by Google,
an addon could probably do it,
but, in the meantime, take a look at the apache extension
mod_page_speed by Google,
Defunct posted a great article about how to reference Google's CDN for jQuery:
http://defunctlife.com/2010/05/slow-speeds-and-speeding-up-concrete...
(be sure to read the comments if you use the layouts feature in C5)
Onehat wrote two articles (one relies on the other) that detailed moving the default Concrete5 js files to the bottom of the document.
http://www.onehat.com/blog/2010/03/concrete5-mod-moving-js-to-the-b...
I posted the completed files on google docs:
https://docs.google.com/leaf?id=0Bz5i6n1THnPDYTI3ZTA5NDEtZjMzYi00MDI...
(note: use at your own risk. It appears that, if you have add-ons that add js files, they don't move to the bottom with this method--from my tests--and thus break if they rely on jquery.)
I would LOVE to see the core team concatenate script files (especially in edit mode) or have someone make an add on that provided supercache-esque functionality (CDN references, minification, concatenation, etc).
At the moment in themes I build I try to combine all my styles into one stylesheet (main.css) and minify them to reduce the number of http requests. I also try to use sprites whenever possible, yada yada yada.
In the end, the best solution is not to have 1 bit hosting. Spend some extra $ and get good pageload speeds.
http://defunctlife.com/2010/05/slow-speeds-and-speeding-up-concrete...
(be sure to read the comments if you use the layouts feature in C5)
Onehat wrote two articles (one relies on the other) that detailed moving the default Concrete5 js files to the bottom of the document.
http://www.onehat.com/blog/2010/03/concrete5-mod-moving-js-to-the-b...
I posted the completed files on google docs:
https://docs.google.com/leaf?id=0Bz5i6n1THnPDYTI3ZTA5NDEtZjMzYi00MDI...
(note: use at your own risk. It appears that, if you have add-ons that add js files, they don't move to the bottom with this method--from my tests--and thus break if they rely on jquery.)
I would LOVE to see the core team concatenate script files (especially in edit mode) or have someone make an add on that provided supercache-esque functionality (CDN references, minification, concatenation, etc).
At the moment in themes I build I try to combine all my styles into one stylesheet (main.css) and minify them to reduce the number of http requests. I also try to use sprites whenever possible, yada yada yada.
In the end, the best solution is not to have 1 bit hosting. Spend some extra $ and get good pageload speeds.
@riotaj: Thank you, those posts were very helpful for my understanding. Thanks!
@Mnkras: I didn't know about Mod_Pagespeed for Apache, thanks for showing it to me. It does look very interesting; but we're not going to deploy it. Re-writing all CSS, JS and more on the fly is decidedly non-trivial. It feels too "auto-magical" to me, I worry that it could lead to rendering bugs eventually...
@Mnkras: I didn't know about Mod_Pagespeed for Apache, thanks for showing it to me. It does look very interesting; but we're not going to deploy it. Re-writing all CSS, JS and more on the fly is decidedly non-trivial. It feels too "auto-magical" to me, I worry that it could lead to rendering bugs eventually...
It's almost a paradox how I came to find C5 in search of something simpler than Drupal (for clients to use) and now I am looking to make C5 more like Drupal.
Drupal gets aggregation right, there were a couple of modules accomplishing this before but now it is standard. All modules include js and css files through a core function (drupal_add_js and drupal_add_css) and this function then adds the files to the page when the page loads. There are even options for gzip, gzip+minify, gzip+jsmin.
I have built a few sites using C5 and I find my larger, more complex sites have better yslow scores, always in the 90s and my C5 sites struggling to stay above 80.
Maybe some devs can check out Drupal and figure out how they do it. I am not a Drupal Developer myself, I am a Site Builder.
Drupal gets aggregation right, there were a couple of modules accomplishing this before but now it is standard. All modules include js and css files through a core function (drupal_add_js and drupal_add_css) and this function then adds the files to the page when the page loads. There are even options for gzip, gzip+minify, gzip+jsmin.
I have built a few sites using C5 and I find my larger, more complex sites have better yslow scores, always in the 90s and my C5 sites struggling to stay above 80.
Maybe some devs can check out Drupal and figure out how they do it. I am not a Drupal Developer myself, I am a Site Builder.
