High Performance Web Sites

The Savings

The most popular tool for minifying JavaScript code is JSMin (http://crockford.com/javascript/jsmin), developed by Douglas Crockford, a fellow Yahoo!. The JSMin source code is available in C, C#, Java, JavaScript, Perl, PHP, Python, and Ruby. The tool of choice is less clear in the area of JavaScript obfuscation. Dojo Compressor (renamed ShrinkSafe and moved to http://dojotoolkit.org/docs/shrinksafe) is the one I've seen used the most. For the purposes of our comparison, I used these two tools. As a demonstration, let's use these tools on event.js from the Yahoo! User Interface (YUI) library (http://developer.yahoo.com/yui). The source code for the first function follows:

YAHOO.util.CustomEvent = function(type, oScope, silent, signature) {
    this.type = type;
    this.scope = oScope || window;
    this.silent = silent;
    this.signature = signature || YAHOO.util.CustomEvent.LIST;
    this.subscribers = [];

    if (!this.silent) {
    }

    var onsubscribeType = "_YUICEOnSubscribe";
    if (type !== onsubscribeType) {
        this.subscribeEvent =
                new YAHOO.util.CustomEvent(onsubscribeType, this, true);

    }
};

The same function passed through JSMin has all unneeded whitespace removed:

YAHOO.util.CustomEvent=function(type,oScope,silent,signature){this.type=type;this. scope=oScope||window;this.silent=silent;this.signature=signature||YAHOO.util. CustomEvent.LIST;this.subscribers=[];if(!this.silent){} var onsubscribeType="_YUICEOnSubscribe";if(type!==onsubscribeType){this.subscribeEv ent=new YAHOO.util.CustomEvent(onsubscribeType,this,true);}}; ...