Monday, July 24. 2006
File compaction
Over the past few days I have been thinking about how to squeeze the most out of our bandwidth. Whether you use a shared hosting account or you have a dedicated server you'll be paying for the bandwidth you use so keeping your usage to a minimum seems like a no-brainer as long as it doesn't affect the service you offer. I've come up with a few ways of doing just this.
The biggest savings in bandwidth usage can be made by compressing pages as they are sent.
Another way to reduce bandwidth usage is to compact your files, by reducing their size before compression it is possible to further reduce bandwidth demand. As we create html, javascript and cascading style sheet files we use whitespace to make our work easier to follow but your visitors browsers have no trouble following the instructions in these files whether whitespace is used or not. By removing this whitespace once we have finished working on these files we can reduce our bandwidth usage without negatively affecting the quality of service visitors receive.
I'm still undecided whether compacting html files is a good idea but I do believe that compacting cascading style sheets (css) and javascript (js) files is a good thing. The main reasons why I am as yet undecided about html files is that in the past I learnt a lot about creating webpages by looking at the source of other peoples webpages. This is less true for css and js files and as such I feel these can be compacted at the cost of readability. If this is an issue for you then a comment at the top of your files (added after the file has been compacted) explaining why the code is so devoid of comments and whitespace and redirecting the visitor to a non-compacted version may be a good solution. You'll want to keep a copy of the non-compacted file anyway just in case you later need to make changes.
Once I had made the decision to reduce the size of my js and css files as much as possible I started looking at what could go without affecting their functionality. The first things which can go are comments; they're ignored when outputting content so there is no reason to keep them in the compacted files. Next are blank lines; useful when working on files but not needed in the final file. Finally are whitespace characters at the end of lines.
There are further steps which can be taken but the four steps outlined above can significantly reduce file sizes without risking any problems with the execution of the files.
To test the file compacting functions I wrote I downloaded js files from hotscripts, css files from CSS Zen Garden and then both js and css files if possible from other popular web applications such as phpBB and Joomla. In total I looked at 11 css files. The average size of the files was 5471 and could be compressed down to 1592. After getting rid of the comments, blank lines and whitespace characters at the end of the lines the file size was 4187 and could be compressed down to 1055. The advantage here is easy to see, comparing the compressed files before and after compaction we can see that the file size has decreased to just two-thirds of the original file size. Overall, by combining both compaction and compression the file size is reduced more than 5-fold.
The results for the js files (12 were looked at in total) wasn't quite as impressive but it was still possible to reduce the file size to just a quarter of the original. Compaction alone resulted in a 20% decrease in file size.
Overall I think compacting files is a useful strategy for getting the most out of my available bandwidth.
The tool can be found here if you want to use it yourself, I hope it is fairly self-explanatory.
Another way to reduce bandwidth usage is to compact your files, by reducing their size before compression it is possible to further reduce bandwidth demand. As we create html, javascript and cascading style sheet files we use whitespace to make our work easier to follow but your visitors browsers have no trouble following the instructions in these files whether whitespace is used or not. By removing this whitespace once we have finished working on these files we can reduce our bandwidth usage without negatively affecting the quality of service visitors receive.
I'm still undecided whether compacting html files is a good idea but I do believe that compacting cascading style sheets (css) and javascript (js) files is a good thing. The main reasons why I am as yet undecided about html files is that in the past I learnt a lot about creating webpages by looking at the source of other peoples webpages. This is less true for css and js files and as such I feel these can be compacted at the cost of readability. If this is an issue for you then a comment at the top of your files (added after the file has been compacted) explaining why the code is so devoid of comments and whitespace and redirecting the visitor to a non-compacted version may be a good solution. You'll want to keep a copy of the non-compacted file anyway just in case you later need to make changes.
Once I had made the decision to reduce the size of my js and css files as much as possible I started looking at what could go without affecting their functionality. The first things which can go are comments; they're ignored when outputting content so there is no reason to keep them in the compacted files. Next are blank lines; useful when working on files but not needed in the final file. Finally are whitespace characters at the end of lines.
There are further steps which can be taken but the four steps outlined above can significantly reduce file sizes without risking any problems with the execution of the files.
To test the file compacting functions I wrote I downloaded js files from hotscripts, css files from CSS Zen Garden and then both js and css files if possible from other popular web applications such as phpBB and Joomla. In total I looked at 11 css files. The average size of the files was 5471 and could be compressed down to 1592. After getting rid of the comments, blank lines and whitespace characters at the end of the lines the file size was 4187 and could be compressed down to 1055. The advantage here is easy to see, comparing the compressed files before and after compaction we can see that the file size has decreased to just two-thirds of the original file size. Overall, by combining both compaction and compression the file size is reduced more than 5-fold.
The results for the js files (12 were looked at in total) wasn't quite as impressive but it was still possible to reduce the file size to just a quarter of the original. Compaction alone resulted in a 20% decrease in file size.
Overall I think compacting files is a useful strategy for getting the most out of my available bandwidth.
The tool can be found here if you want to use it yourself, I hope it is fairly self-explanatory.

I rank well for the weirdest things. Recently I've been trying out some web analytics tools and I thought I would share some of my discoveries. I'm mainly going to talk about the search queries I rank well for. If you are interested then read on, if
Tracked: Dec 01, 15:46
There was an interesting post on Wednesday from Joshua Eichorn. Briefly he runs through a method for caching compressed javascript and css files prior to hosting them on a web server. He makes this all work with a few lines in a .htaccess file. It is
Tracked: Jan 13, 18:00
This is the final instalment in a three part series. In part 1 I briefly outlined how to prevent other sites displaying your web pages within frames. In part 2 I talked about how to allow exceptions for the rare situations when you want to allow sites t
Tracked: Mar 13, 07:36
For a couple of weeks now I've been intending to release two new tools for this site. For one week they've been live on the site (though not linked to) and still I haven't mentioned them. It could be said I'm procrastinating. This is a shame because
Tracked: Jun 20, 22:27
Scraping content from the web is a real pain. In fact, at the moment, I can't think of any programming tasks I like less. I'm sure they exist I just can't think of them - feel free to remind me in the comments. I'm setting up a tool at the moment tha
Tracked: Jul 08, 15:02