There are two common ways that people use to reduce the
download size of a JavaScript file: compression and minification.
When you host your website on a Windows Server using IIS
7.0, you can configure IIS to automatically compress your JavaScript files
using GZIP compression – which can provide a significant improvement on
performance and the download size of files. However, you can get additional
performance benefits by both compressing and minifying your JavaScript files.
Steve Sounders describes these additional benefits in his excellent book High Performance Web Sites.
In addition to releasing Microsoft Ajax Library (Preview 6),
we are today also releasing a new (free) Microsoft Ajax Minifier utility that can help reduce the
size of your JavaScript files considerably. It was created by Ron Logon
who works on the MSN team. You can download the Microsoft Ajax Minifier from the ASP.NET
CodePlex website for free.
The following screenshot demonstrates the results of
minifying the standard jQuery library using various minification tools such as
Douglas Crockford’s JSMin, Dean Edward’s Packer, and the YUI Compressor. The
bottom two files were minified using the Microsoft Ajax Minifier utility. Notice that the Microsoft
Ajax Minifier has reduced jQuery from 125 KB to only 53 KB.
Figure 10
The Microsoft Ajax Minifier supports two levels of
minification: normal and hypercrunched. When you use normal minification, the
Microsoft Ajax Minifier removes all unnecessary whitespace, comments, curly
braces, and semi-colons. When you enable hypercrunching, the Microsoft
Ajax Minifier becomes more aggressive in reducing the size of a JavaScript
file, and it minifies local variable names and removes unreachable code.
Here’s a sample of a JavaScript file:
Figure 11
Here’s what the JavaScript file looks like after it has been
minified with the Microsoft Ajax Minifier (with hypercrunching enabled):
Figure 12
Notice that all unnecessary whitespace has been removed. Notice
also that the function parameters firstValue and secondValue have been renamed
to b and a.
The Microsoft Ajax Minifier download includes the following
components:
ajaxmin.exe – A command-line tool for minifying JavaScript
files.
ajaxmintask.dll – A MSBuild task for minifying JavaScript
files in a Visual Studio project.
ajaxmin.dll – A component that you can use in your C# or
VB.NET applications to minify JavaScript files.
After you install the Microsoft Ajax Minifier, you can use
the Microsoft Ajax Minifier command-line tool to minify a JavaScript file from
a command-prompt.
You also have the option of adding the Microsoft Ajax
Minifier as a custom MSBuild task to Visual Studio. Adding the Microsoft Ajax
Minifier MSBuild task to your Visual Studio project file allows you to
automatically minify all of the JavaScript files in your project whenever you
perform a build, and enables you to perform minification in an automated way.