The general idea behind compression/combination is to reduce the number of characters that must be sent over the wire as well as reduce the number of HTTP calls that must be made. Each time a browser gets a request to download a JS file, there is a certain amount of overhead incurred in negotiating and completing the HTTP request. Combining all JS files into one file is a great way to speed up a web application.
Everyone Already Knows This, Right?
There happens to be a compressor/combinator that handles CSS files, the YUI Compressor. For most web application developers, YUI Compressor is an annoying tool to use because, as a java application, it must be installed and run from the command line. Yuck!, right?
How well does it work?
I added all 14 CSS files from The Health Challenge and compressed/combined them with Scriptalizer. Here are the results:
- Number of Files Before: 14
- File Size of All Files: 35.42 KB
- Number of Files After: 1
- File Size of All Files: 19.96 KB
As you can see, the reduction was significant. Not only have I cut the size of my CSS assets by ~50%, I have also removed 13 HTTP connections.