What do you use to minimize and compress JavaScrip

Question

What do you use to minimize and compress JavaScript libraries?

Answer 1

UglifyJS is a new one.

UglifyJS compresses better than YUI Compressor and just about on par with the Google Closure Compiler. For example, the compressed version of jQuery from the Google Closure Compiler is only 403 bytes smaller than the version produced by UglifyJS - impressive! UglifyJS is also the fastest to run by a long shot, beating Closure by over 6 seconds!

Additionally, the code produced by UglifyJS is safer than the code that Closure generates. For example, Closure doesn’t know how to deal with eval or with{} - it just logs an error and continues to rename variables anyway. This, obviously, leads to broken code. UglifyJS does not have this problem.

More information can be found here: http://badassjs.com/post/971960912/uglifyjs-a-fast-new-javascript-compressor-for-node-js

Answer 2

http://caja.appspot.com/tools/index does all three of HTML/CSS/JS.

Answer 3

There is a very good online compressor:

http://javascriptcompressor.com/

You can also shrink variables, if you want even more compresed.

Hope it helps

Answer 4

Google's closure tools

You can map the minified version to the regular source code for debugging in Firebug with their add-on.

Answer 5

Here is an article which described how to use YUI Compressor for minimizing files during build: Compressing JS files as part of your build process

Answer 6

Here's a solution from Microsoft that you can integrate into Visual Studio to minify the files automatically when you build your project.

To Install:

Download the msi from : http://aspnet.codeplex.com/releases/view/40584

You may need to restart your computer after its finished.

To Use:

Edit your .csproj file and include the following at the end of the file (but before the </Project> tag):

<Import Project="$(MSBuildExtensionsPath)\Microsoft\MicrosoftAjax\ajaxmin.tasks" />

<Target Name="AfterBuild">
    <ItemGroup>
        <JS Include="**\*.js" Exclude="**\*.min.js;Scripts\*.js" />
        <CSS Include="**\*.css" Exclude="**\*.min.css" />
    </ItemGroup>
    <AjaxMin 
    JsSourceFiles="@(JS)"
    JsSourceExtensionPattern="\.js$"
    JsTargetExtension=".min.js"
    CssSourceFiles="@(CSS)"
    CssSourceExtensionPattern="\.css$"
    CssTargetExtension=".min.css"/>
</Target>

Now when you build your project, all CSS and js files that don't end in .min.js, .min.css will be minified (See the "Exclude" attribute to exclude other files from being minified).