There are a number of ways to speed up a website. An easy one would be to compress asset files and compact the files.
This has been widely done for Javascript files with popular tools such as JSMIN and Packer.
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?
Probably. However, CSS files can often be as numerous and verbose as Javascript files. How come there no public outcry for CSS compression/combination?
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?
Scriptalizer, developed by ColdFusion luminary Aaron Lynch, is a web front end for the YUI compressor. Scriptalizer has handled Javascript compression/combination for a while now and is a nicely designed, easy to use tool. Aaron recently added support for CSS compression/combination. Now, dealing with CSS files is as simple as dealing with JS files.
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.