Compression – Part I

6 04 2010

Probably when you think of compression you may think of a gzip file or something that may have been winzipped. But there is another kind of compression, one that is especially helpful for JavaScript and it goes by the name of minification. Essentially, minification is a a form of compression that deletes all the unnecessary white space, i.e. tabs, newlines, blank space and comments, such that you end up with a smaller file that can still make sense to a browser when the JavaScript executes.

You can download a minifier or you can use an online service. I tried http://jscompress.com/ and liked the results well enough to recommend it.

If you do decide to minify your JavaScript, then you need to have a strategy in place as to what you will do if you need to modify the script. Where will you keep the unminified script and how will you make sure that it matches the minified one? What I did was to keep the names of the scripts the same and simply have two subdirectories offline, one called js and the other jsmin. All the scripts in jsmin are what I put online or at least that’s the plan for now.

You may also minify your CSS — I haven’t done that yet, but it is recommended by Yahoo. See http://developer.yahoo.com/performance/rules.html for more information. According to Yahoo, even if you gzip your JavaScript and CSS, you will still gain an extra savings of 5% or greater if you apply minification to these types of content, i.e. external JavaScript and CSS files as well as inline scripts and styles.

This work is licensed under a Creative Commons License
.

Advertisements

Actions

Information

One response

12 04 2010
Compression – Part II: PHP’s ob_gzhandler() « Sharon Lee Levy's Blog

[…] } Recently, I discussed minification and today I’m going to examine using PHP to compress output using the ob_gzhandler(). There […]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s




%d bloggers like this: