Concrete5 Mod: Moving JS to the Bottom
Permalink
Helpful blog post about moving Javascript code to the bottom of the HTML source to improve front-end performance:
http://www.onehat.com/blog/2010/03/concrete5-mod-moving-js-to-the-b...
http://www.onehat.com/blog/2010/03/concrete5-mod-moving-js-to-the-b...
We are now moving to Concrete5 for the larger content-heavy sites we build. Our home-grown CMS is very flexible and powerful, but Concrete5 is a more-mature product and has a better front-end than ours.
Interestingly, the design and thinking behind each is very similar. That's one of the reasons we decided to use Concrete5... it feels familiar.
And thanks for the kind comments.
Interestingly, the design and thinking behind each is very similar. That's one of the reasons we decided to use Concrete5... it feels familiar.
And thanks for the kind comments.
nice work... is there a chance to see this in c5?
It would need to be tweaked a bit in order to be integrated with the C5 core, since the method it uses to know which JS to move and which to keep in the header is by detecting if the headerItem is an object of class SiteJavaScriptOutputObject. A different detection scheme would need to be implemented.
I considered what it would take to automatically move *all* JS code to the bottom, but that is fraught with difficulty. Not all JS code in the core (not to mention any add-ons) gets added to the HTML source using addHeaderItems(). This creates problems with dependencies. For instance, if jQuery gets moved to the bottom of the source, all dependencies on it will break if they get added earlier in the HTML source.
In order to move all JS to the bottom, it would have to become a universally-enforced behavior to always add JS using addHeaderItems(). This would mean a lot of work refactoring core code and add-ons, and might be a continual headache for newbies (why am I getting an error that says jQuery is undefined?!).
I considered what it would take to automatically move *all* JS code to the bottom, but that is fraught with difficulty. Not all JS code in the core (not to mention any add-ons) gets added to the HTML source using addHeaderItems(). This creates problems with dependencies. For instance, if jQuery gets moved to the bottom of the source, all dependencies on it will break if they get added earlier in the HTML source.
In order to move all JS to the bottom, it would have to become a universally-enforced behavior to always add JS using addHeaderItems(). This would mean a lot of work refactoring core code and add-ons, and might be a continual headache for newbies (why am I getting an error that says jQuery is undefined?!).
I liked your blog post. I then looked at your very nice web site and noticed you (or someone at the company) said you have your own CMS you guys have developed. With that said and your post, are you now using Concrete5 as your CMS or for several sites?