I am curious to understand what all things a compressor like yui-compressor do to compress a js or css file, what steps do i need to take if i want to write my own compressor.
Add a comment
|
3 Answers
The YUI Compressor is written in Java (requires Java >= 1.4) and relies on Rhino to tokenize the source JavaScript file. It starts by analyzing the source JavaScript file to understand how it is structured. It then prints out the token stream, omitting as many white space characters as possible, and replacing all local symbols by a 1 (or 2, or 3) letter symbol wherever such a substitution is appropriate (in the face of evil features such as eval or with, the YUI Compressor takes a defensive approach by not obfuscating any of the scopes containing the evil statement) The CSS compression algorithm uses a set of finely tuned regular expressions to compress the source CSS file. The YUI Compressor is open-source, so don't hesitate to look at the code to understand exactly how it works.
Comments
From the official doc site
" How does the YUI Compressor work? The YUI Compressor is written in Java (requires Java >= 1.4) and relies on Rhino to tokenize the source JavaScript file. It starts by analyzing the source JavaScript file to understand how it is structured. It then prints out the token stream, omitting as many white space characters as possible, and replacing all local symbols by a 1 (or 2, or 3) letter symbol wherever such a substitution is appropriate (in the face of evil features such as eval or with, the YUI Compressor takes a defensive approach by not obfuscating any of the scopes containing the evil statement) The CSS compression algorithm uses a set of finely tuned regular expressions to compress the source CSS file. The YUI Compressor is open-source, so don't hesitate to look at the code to understand exactly how it works."
Css compression code here https://github.com/yui/yuicompressor/blob/master/src/com/yahoo/platform/yui/compressor/CssCompressor.java
Js compression code here https://github.com/yui/yuicompressor/blob/master/src/com/yahoo/platform/yui/compressor/JavaScriptCompressor.java
2 Comments
spirit3189
Js compression internals 1) Read source file 2)Emit white spaces and build a symbol tree. 3)Now munge (replacing chars) the symbols.Avoid evals and un-named un-namepspaced global variables.
sushil bharwani
that for your answer, i actually didnt understand the meaning of symbol tree. What do u mean by symbol
As I know theses are major steps :
- Remove every extra space (the parser doesn't need them)
- Remove carriage returns (the parser doesn't need them too)
For the JS
- Replace variables names for new ones shorter, unique of course
EDIT : The simpliest way to have a good idea is actually to create one CSS and JS and see difference after compression.
