How YUI Compressor compresses JavaScript

I recently wrote a jQuery plug-in. When I finally finished the optimization, I found that the compressed file is relatively large, so I thought about the files that can be modified and optimized, we can also find that there is a lot of room to learn about the compression principle. Through this in-depth understanding of YUI Compressor's JavaScript compression, those can be compressed, especially those that cannot be compressed, it must be clear that only plug-ins can be written in order to keep files smaller and code more sophisticated, and the code to be improved will also be found in the optimization process, it will be of great help in the future. I found an article on the Internet to record it.

YUI Compressor:

• Remove comment
• Remove extra spaces
• Minor Optimization
• Identifier Replacement)

What are the minor optimizations of YUI Compressor?

• object["property"]If the property name is a legal JavaScript identifier (Note: A Legal JavaScript identifier -- starts with a letter and is selectively followed by one or more letters, numbers, or underscores) it is not a reserved word and will be optimized:object.property
• {"property":123} If the property name is a valid JavaScript identifier and is not a reserved word, It is optimized{property:123}(Note: If the property name is a valid JavaScript identifier and is not a reserved word, it is not mandatory to enclose the property name in quotation marks ).
• 'abcd\'efgh', Will be optimized"abcd'efgh".
• "abcd" + "efgh", If the string is connected, it will be optimized"abcdefgh"(Note: All strings in the script are connected with the connector "+", which has the highest efficiency and maintainability ).

Which is the most effective compression Optimization for JavaScript?Identifier replacement.

For example:

(function(){    function add(num1, num2) {        return num1 + num2;    }})();

After the identifier is replaced:

(function(){function A(C, B) {return C+ B;    }})();

Then, remove the extra space and the result is:

(function(){function A(C,B){return C+B;}})();

Replace the YUI Compressor identifier Function Name and variable nameWhich of the following cannot be replaced?

• Original Value: String, Boolean value, number, null, and undefined. Generally, strings occupy the most space, rather than numeric literal values (true, false, null, underfinded ).
• Global variables: window, document, XMLHttpRequest, and so on. Document and window are the most commonly used.
• Attribute name, such as foo. bar. The occupied space is second only to the string, and the "." operator cannot be replaced, and a. B. c is more free.
• Keyword. Frequently Used keywords include var and return. Best optimization method: A function only displays the var and return keywords once.

The Optimization Methods for raw values, global variables, and attribute names are roughly the same:Any literal value, global variable, or attribute name that is used more than twice (including twice) should be replaced by local variable storage.

However, in some cases, replacement of identifiers is prohibited:

• Use the eval () function. Solution: Do not use or create a global function to encapsulate eval ().
• Use the with statement. Solution: Same as above.
• The condition annotation of JScript. The only solution: Do not use.

Because YUI Compressor is built on rhino interpreter, all the above optimizations are secure.

Additional reading:

• Extreme JavaScript Compression With YUI Compressor