Home » Guides Beginner Article

Compressed JavaScript

Not rated

Joseph Scott
July 18, 2006

Joseph Scott
Joseph Scott is a California-based web developer.  He is fascinated by the idea of working with large databases, especially when using open source technologies like PostgreSQL and MySQL. Most of his coding of late has been with PHP, with a fair bit of Perl over the years.

Joseph Scott has written 1 articles for JavaScriptSearch.
View all articles by Joseph Scott...

Here is an interesting feature that I didn’t know about, you can compress JavaScript and use that file directly, just like the uncompressed version. So after gzip prototype.js you can use it in a web page with:

<script type="text/javascript" src="prototype.js.gz"></script>

No need for mod_gzip or mod_deflate in Apache. Compress the file once and enjoy the reduced bandwidth and load on your web server.

This is pretty cool because prototype.js (version 1.5.0_rc0) is 55,150 bytes. After gzip on my Mac OS X system prototype.js.gz shrinks down to 12,479 bytes. Easy way to loose 42,671 bytes. You can save another 98 bytes by using gzip -9, down to 12,381 bytes. Unfortunately none of the browsers seem to support bzip, which shrank prototype.js down to 11,556 bytes.

I’ve tested this on Firefox 1.5 and IE 6 on Windows; Firefox 2, Opera 9 and Safari 2.0.3 on Mac OS X. Before you get too excited there is one problem, this doesn’t work on Safari. All of the browsers that I tested showed no difference between gzip and non-gzip JavaScript except for Safari.

So if you want to properly support Safari in your web app you’ll have to skip this idea completely or look at some sort of browser detection mechanism (ick) which would serve uncompressed JavaScript to Safari.

Add commentAdd comment (Comments: 1)  
Title: Correct Apache configuration settings December 6, 2006
Comment by Wayne Lee

Hi, It doesn't work out on my Apache server, instead I discovered another way to work around: In my case I use .jsgz and .gifz for gzipped JS and GIF files respectively, and add below seetings to httpd.conf: AddEncoding x-gzip .jsgz AddEncoding x-gzip .gifz AddType text/html .jsgz AddType image/gif .gifz In this way, the gzipped file will be identified as text/gif with gzip encoding in HTTP Response header :)



Related Resources

Other Resources