Download to read offline
![Extra tricks
• Remember, reserved words can't be minified.
• Re-define common long reserved names and attach to a global object
Instead of:
gl.TEXTURE_MIN_FILTER
Global.js:
var $;
$.minFilterVar = 'TEXTURE_MIN_FILTER';
everywhere else:
gl[$.minFilterVar]
• Seems longer at first, but compresses really well!](https://image.slidesharecdn.com/minification-140918044344-phpapp02/85/Extreme-Javascript-Minification-8-320.jpg)
Uploaded byDavid Goemans
Extreme Javascript Minification
The document discusses various JavaScript minification and compression techniques for the js13k competition, emphasizing the need to keep the code package under 13kb. It reviews several tools like Uglify2JS, YUI, Closure, and JS Crush & Packer, highlighting their compression efficiencies and requirements for minimal code changes. The author also provides tips on optimizing file names and managing reserved words for better compression outcomes.
Extreme Javascript Minification
- 1. Extreme Javascript Minification Compression experiments for JS13k by David Goemans BoosterMedia 2014
- 2. • For JS13k,your delivered package needs to be 13kb or less • It can be compressed but as a standard zip format • This gives you about 90kb for actual code • Many techniques available: • Uglify2JS • YUI • Closure • JS Crush & Packer • Zip Formats are restrictive • Renaming tricks ( Globals ) What?
- 3. • Very goodfor day-to-day compress Uglify2JS • Node/Grunt module makes for super easy integration • Works out of the box, virtually never requires code changes • Compresses very well, but not well enough
- 4. • With advancedcompression, performs better than Uglify • Minimal code changes required to make it compress well • Compression is pretty good, but... YUI
- 5. • Great compressionwith advanced compilation • Requires code changes, especially related to global variables • Some APIs not recognized by the compiler, such as PointerLock • Best compression for zipping Closure ~75kb code ~26kb code
- 6. JSCrush & Packer • These are amazing pieces of technology. • Crazy compression for javascript, much smaller .js files than the other options • For best results, first run through Closure or Uglify with simple optimizations • Since they're already so well compressed, they don't zip very well • Not that useful for JS13k, and normal use, but great for JS1k!
- 7. • Zip hasa few algorithms you can use, but only deflate is widely supported • Deflate is based on Huffman trees, which works by detecting patterns • Lots of the same text close together compresses well • This is why JSCrush/Packer doesn't zip very well! • Each file generates some overhead • • Less files with shorter names is best Zip
- 8. Extra tricks •Remember, reserved words can't be minified. • Re-define common long reserved names and attach to a global object Instead of: gl.TEXTURE_MIN_FILTER Global.js: var $; $.minFilterVar = 'TEXTURE_MIN_FILTER'; everywhere else: gl[$.minFilterVar] • Seems longer at first, but compresses really well!
- 9. David Goemans Leaddeveloper @ BoosterMedia Game Studio david.goemans@boostermedia.com @dgoemans About me Links: JS13k Project code: https://github.com/dgoemans/shipwrecked Extra info on zip compression: https://gist.github.com/subzey/b18c482922cd17693d65