" />
These pages are old. They apply to UglifyJS v2. Version 3 has evolved a lot in the mean time to support most of ES6. Please check the documentation in the official repository for up-to-date information. Big thanks to all contributors, especially to Alex Lam S.L., who has maintained this project for years!
UglifyJS contains a scope analyzer which figures out variable/function definitions, references etc. You need to call it manually before compression or mangling:
toplevel.figure_out_scope();
The figure_out_scope method is defined only on the AST_Toplevel node.
Several methods do meaningful things after a call to figure_out_scope:
true if this
symbol cannot be renamed (it's either global, undeclared, or defined in
scope where eval or with are in use.true if this
symbol is not referenced.true if this
symbol is undeclared.true if this
symbol is defined in the global (toplevel) scope.figure_out_scope will supplement nodes with additional information:
true if the with
statement is used in this scope or any subscopes.true if a direct call to
the global eval is seen in this scope or any subscope.After parsing you'll want to call toplevel.figure_out_scope() in order to supply additional information in the AST. This function will create an unique definition for each symbol. Think of code like this, for example:
function f(x) {
if (something) {
var x = 10;
}
var x = 20;
}
Are the x-es the same variable? Well, they should be, although in the AST they are different AST_SymbolDeclaration nodes. The scope analyzer will create a single definition and point each of them to the same definition. This definition is a SymbolDef object and it has the following properties:
name — the original symbol name
orig — an array of AST_SymbolDeclaration-s where this variable is defined; for the case above it would contain all 3 x-es.
scope — points to the AST_Scope where this is defined.
references — an array of AST_SymbolRef nodes that were determined to point to this definition.
global — boolean, tells us if this is a global definition.
undeclared — boolean, tells us if this is an undeclared definition (more below about undeclared names).
constant — boolean, true if this is a constant
definition (occurring in const).
mangled_name — the mangled name for this node, created by toplevel.mangle_names(). If present, the code generator will use this name when printing symbols.
When it sees an undeclared symbol such as the Q below:
function f(x) {
return Q + Q + x;
}
UglifyJS will still create a SymbolDef, but mark it "undeclared". This is for consistency, so that every symbol's definition() method returns something usable. It also might be useful for various applications to track access to undeclared globals, which can be found in the SymbolDef's references property.
JS compressor of world fame.
Note that this is only tested with Chrome and Firefox. Should work with Safari as well, but most probably not with Opera or IE.
Paste your code in the left box. Click "Uglify!" to get compressed output on the right. The left-side will turn into the Ymacs editor. At this point if you click any token in the minified area, the editor on the left will move to the original location of that minified token.
Tick the "As I type" checkbox to turn on minification on-the-fly.
When the compressor warns, you'll get a flashing button in the toolbar. Click on it to display the warnings (temporarily covers the minified area). Click a warning in the list to go to that position in the source. If you have "on-the-fly" and fix warnings, the list will update automatically.
You can enable/disable the compressor, mangler and beautifier. For additional control check the buttons on the right ("Compressor..." and "Codegen..."). Those options are saved in localStorage, they will be remembered the next time you visit this page.
Enjoy!
/** May the source-map be with you! **/