What do you use to minimize and compress JavaScript libraries? [closed]

Answer 1

I don't minimize JavaScript at all: gzip compression is good enough for me and has the additional benefit that error messages will still be useful.

Answer 2

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).

Answer 3

You have a herd of possibilities here:

• The YUI Compressor mentioned by other answers,
• The Google Closure Compiler,
• The Dojo ToolKit's ShrinkSafe compiler used by their build system,
• Douglas Crockford's still actual JSMin,
• UglifyJS mentioned by others,
• And a commercial solution, javaScript Obfuscator (never used personally)

From my personal experience, I'd recommend that you use the Dojo SDK to build a custom build, which you can then in turn configure to either use their usual ShrinkSafe compiler, or Google Closure, which they now support as well.

In terms of compression, I think Google Closure is the one yielding the best results for me so far, however I am usually satisfied with ShrinkSafe and it's a bit older and more robust, whereas Closure Compiler looks a bit of a new kid on the block (which your stakeholders might not be too fond of, for instance).

Some people swear only by the YUI Compressor though. I personally cannot really vouch for it.

Now if you question was to compress libraries and not just your own JavaScript code, it obviously gets really more involved, as you will need for most of these tools to export the symbols that should not be renamed or stripped. Most decent compressors will remove functions that they think are unused - often the case in a library, if not bound to a project, obviously - and change the names to make them shorter and use less characters - also a problem as you obviously want a public API to not be tampered with.

You can find other threads on this topic as well and find information in the tools' support documentation. You may also want to have a look at JSBuilder2, some sort of pendant to Dojo's Build tool (so, using ShrinkSafe or Closure Compiler) for ExtJS (using the YUI compressor).

(Sorry, being a new SO user, I cannot add more than one link so I cannot link directly to the tools.)

EDIT: regarding the concerns expressed in some answers that compression might introduce bugs and that it makes debugging easier as the code is not mangled: yes, it's a valid concern. However:

• you will get a very significant improvement in terms of bandwidth if you use a minifier, even with gzip compression activated (and you can learn to leverage gzip compression by making the compressor's life easier
• you should just taste your code in debug and production mode to ensure the behavior is identical. I mean, it's part of your job as well...
• some of these compressors have been around for a while and won't really introduce bugs into your code. They're really just re-organizing things and substituting strings, really.
• some compressors (for instance the dojo build system) come with options to allow you to produce both a compressed and an uncompressed output, so that you can then enable different modes for debugging and production, using query parameters for instance.

Answer 4

I have tried YUI compressor before, but it gives me error message.

I suggest using JSMIN to minify your javascript:

http://www.crockford.com/javascript/jsmin.html

Answer 5

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

Answer 6

There is a very good online compressor:

http://javascriptcompressor.com/

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

Hope it helps