Best JavaScript Compressor

Best JavaScript compressor

I recently released UglifyJS, a JavaScript compressor which is written in JavaScript (runs on the NodeJS Node.js platform, but it can be easily modified to run on any JavaScript engine, since it doesn't need any Node.js internals). It's a lot faster than both YUI Compressor and Google Closure, it compresses better than YUI on all scripts I tested it on, and it's safer than Closure (knows to deal with "eval" or "with").

Other than whitespace removal, UglifyJS also does the following:

• changes local variable names (usually to single characters)
• joins consecutive var declarations
• avoids inserting any unneeded brackets, parens and semicolons
• optimizes IFs (removes "else" when it detects that it's not needed, transforms IFs into the &&, || or ?/: operators when possible, etc.).
• transforms foo["bar"] into foo.bar where possible
• removes quotes from keys in object literals, where possible
• resolves simple expressions when this leads to smaller code (1+3*4 ==> 13)

PS: Oh, it can "beautify" as well. ;-)

Which javascript minification library produces better results?

Better is a bit subjective here, since there are multiple factors to consider (even beyond those you list):

1. Compressed size doesn't tell the whole story, since an aggressive compressor can result in slower run-time performance due to the additional time needed to run unpacking code prior to browser interpretation.
   
   
   • Errors are easiest to avoid when you control the input code - judicious use of semicolons goes a long way. Run JSLint over your code, and fix any problems reported.
   • The style and size of the code itself will affect the results, of course.
   • And finally, it's worth keeping in mind that server-side gzip compression will always result in a smaller download than any code compression, although some code compression tools will combine with gzip more effectively.

My recommendation is to run the code you intend to compress through several compressors (an automated comparison tool such as CompressorRater helps...), and choose based on the results - remembering to test, profile and compare the actual page load times afterward.

Is there a good JavaScript minifier?

UglifyJS2, used by the jQuery project.

JavaScript compressor

Google Closure Compiler is fairly popular.

javascript: Which is the powerful javascript compressor

Besides the raw size of the generated script, another thing that you must keep in mind is the performance required to executed that script. If the compression is done in a way that it requires the browser to first decompress or regenerate the original code then you are creating a performance hit so maybe choosing anyone of the other compressors would have been a better choice, specially as the files are sent once and cached at the browser, but the decompression must be done everytime the page is loaded.

What is the best JavaScript compression/obfuscation tool?

Closure Complier: http://code.google.com/closure/compiler/

YUI Compressor: http://developer.yahoo.com/yui/compressor/

Come to mind. You'll want to take them for a spin with your own code, as a lot of factors come into play with minifying. Basically, see which one makes the smallest file (and verify that your code works as it should).

Which is the best javascript minifier UglifyJS or YUI compressor?

Question does not contain criteria for 'Best' :) If you ask me about simple - here is one:
JS Miinifyer (http://jscompress.com/)

• This is simple - copy paste your JS and get the output.
• This checks syntax - it will not compress if there are syntax errors
  (at least some level of checking I am not sure if it checks details.)
• You can upload JS files also instead of just copy paste.

We used this for our productions deployments to do:
1. Compression.
2. Uglify JS

What is the best method to reduce the size of my Javascript and CSS files?

In addition to using server side compression, using intelligent coding is the best way to keep bandwidth costs low. You can always use tools like Dean Edward's Javascript Packer, but for CSS, take the time to learn CSS Shorthand. E.g. use:

background: #fff url(image.gif) no-repeat top left;

...instead of:

background-color: #fff;
background-image: url(image.gif);
background-repeat: no-repeat;
background-position: top left;

Also, use the cascading nature of CSS. For example, if you know that your site will use one font-family, define that for all elements that are in the body tag like this:

body{font-family:arial;}

One other thing that can help is including your CSS and JavaScript as files instead of inline or at the head of each page. That way your server only has to serve them once to the browser after that browser will go from cache.

Including Javascript

<script type="text/javascript" src="/scripts/loginChecker.js"></script>

Including CSS

<link rel="stylesheet" href="/css/myStyle.css" type="text/css" media="All" />

What do you use to minimize and compress JavaScript libraries?

I use YUI Compressor. Seems to get the job done well!

---

Related Topics