Concatenating Stylesheets and JavaScripts

Post Information

Posted on January 12, 2011

By Brandon Keepers

We want to make your sites faster without you having to think about it. As Yahoo explains in their Best Practices for Speeding Up Your Web Site, minimizing the number of HTTP requests is an essential step:

80% of the end-user response time is spent on the front-end. Most of this time is tied up in downloading all the components in the page: images, stylesheets, scripts, Flash, etc. Reducing the number of components in turn reduces the number of HTTP requests required to render the page. This is the key to faster pages.

Harmony will now concat multiple stylesheets and JavaScripts for you. All you have to do is use the stylesheets and javascripts filters in your templates, just like you have before. But now, behind the scenes, we’ll put the files together to make one single request. That makes your site load faster, and a better user experience. All without you having to do a thing.

2 Comments

  1. Daniel Morrison Daniel Morrison

    Awesome, except you broke our site big time.

    The concat order is alphabetical, not the order that we define them. So apparently our site has been borked since this deploy and we’re just now finding out.

    For shame! Don’t you have tests for this? :P

  2. Brandon Keepers Brandon Keepers

    Sorry to cause you problems. Until you updated content, your site was still using the cached version. So the good news is that your site likely wasn’t broken until you updated it. We do have tests for all this, but apparently my tests just happened to request the files in alphabetical order.

    I deployed a fix, so you should be back in business.