![Simple Optimizations
• var varName = “” var a = “”
• object[“property”] object.property
• {“key” : “val”} {key : “val”}
• „xi‟an‟ “xi‟an”
• “I am ” + “hot” “I am hot”
GC
YC](https://image.slidesharecdn.com/closure-compiler-vs-yui-compressor-091109210742-phpapp02/85/Closure-Compiler-vs-YUICompressor-9-320.jpg)
![Simple Optimizations
• a = new Object a = {}
• a = new Array a = []
• if(a) b() a && b()
• if(a) b(); else c() a ? b() : c()
• if(1) b(); else c() b()
• return 2 * 3; return 6;
• return undefined; return;
• var f = function(){} function f(){}
• var a; var b; var a, b;
• … GC
YC](https://image.slidesharecdn.com/closure-compiler-vs-yui-compressor-091109210742-phpapp02/85/Closure-Compiler-vs-YUICompressor-10-320.jpg)
Closure Compiler vs YUICompressor
- 1. Google Closure Compiler vs. YUI Compressor lifesinger@gmail.com 2009-11-09
- 2. Who’s this guy? http://lifesinger.org/
- 3. Players • GC = Google Closure Compiler http://code.google.com/p/closure-compiler/
- 4. Players • YC = YUI Compressor http://yuilibrary.com/downloads/#yuicompressor
- 5. Optimization Levels ① Whitespace Level ② Simple Optimizations ③ Advanced Optimizations
- 6. Whitespace
- 7. Whitespace Level • Remove comments • Remove extra white space • Remove unneccessary semicolon GC YC
- 9. Simple Optimizations • var varName = “” var a = “” • object[“property”] object.property • {“key” : “val”} {key : “val”} • „xi‟an‟ “xi‟an” • “I am ” + “hot” “I am hot” GC YC
- 10. Simple Optimizations • a = new Object a = {} • a = new Array a = [] • if(a) b() a && b() • if(a) b(); else c() a ? b() : c() • if(1) b(); else c() b() • return 2 * 3; return 6; • return undefined; return; • var f = function(){} function f(){} • var a; var b; var a, b; • … GC YC
- 11. Simple Optimizations • Simple dead code removal GC YC
- 13. Advanced Optimizations • Dead code removal & Function inlining GC YC
- 14. Advanced Optimizations • Aggressive renaming GC unsafe
- 15. Advanced Optimizations • More amazing but unsafe advanced optimizations: http://code.google.com/closure/compiler/docs /api-tutorial3.html#better
- 16. Whitespace Level Simple Level Advanced Level GC YC Basic
- 18. Helping Compressors ① Use local variables to store: 1. Repeated primitive values 2. Global variables 3. Object properties Good practices for YC and GC both.
- 19. Helping Compressors ② Try to have only one var statement: Good practice for YC. Unneccessary for GC.
- 21. Hurting Compressors ① eval() is Evil. GC YC
- 23. Hurting Compressors ② with statement considered harmful. GC YC
- 25. Hurting Compressors ③ Jscript conditional comments
- 26. Hurting Compressors Solutions: - Solution #1: Don’t use - Solution #2: See Solution #1
- 27. Sugar
- 28. Comments • Preserve some comments: YC
- 29. Annotation Check http://code.google.com/closure/compiler/docs/js-for-compiler.html GC
- 30. File Combination java -jar compiler.jar --js=in1.js --js=in2.js ... --js_output_file=out.js GC
- 31. native2ascii • GC works well for utf-8 encoding files. • YC doesn’t have this feature.
- 32. native2ascii YC + native2ascii command script:
- 33. native2ascii GC script for GB18030 encoding files: Suggest GC to support: --charset GB18030
- 34. CSS Compression • YC is good! • GC comes on!!!
- 36. Summary • YC is more reliable. • GC is amazing, and almost safe at simple optimization level. • GC is promising, but unsafe at advanced optimization level.
- 37. References • http://www.slideshare.net/nzakas/extreme- javascript-compression-with-yui- compressor • http://stackoverflow.com/questions/168642 8/should-i-use-the-yui-compressor-or-the- new-google-closure-compiler-to-compress- my • http://news.ycombinator.com/item?id=924 426
- 38. Thanks!