Issue link: https://read.uberflip.com/i/1146286
74 | Chapter 10: Rule 10: Minify JavaScript In practice, minifying inline scripts is easier than minifying external scripts. What- ever page generation platform you use (PHP, Python, Perl CGI, etc.), there is proba- bly a version of JSMin that can be integrated with it. Once the functionality is available, all inlined JavaScript can be minified before being echoed to the HTML document. Gzip and Minification Rule 4 stresses the importance of compressing content and recommends using gzip to accomplish this, resulting in a typical size reduction of 70%. Gzip compression decreases file sizes more than minification—that's why it's in Rule 4 and this is Rule 10. I've heard people question whether minification is even worthwhile if gzip com- pression has already been enabled. Table 10-5 is similar to Table 10-2, except the responses are gzipped. When gzipped, the average size of the JavaScript payload drops from 85K (see Table 10-2) to 23K (see Table 10-5), a reduction of 73%. It's reassuring to see that the guidelines of Rule 4 hold true for these six web sites. Table 10-5 shows that minifying the files in addi- tion to gzipping them reduces the payload by an average of 4K (20%) over gzip alone. It's interesting that obfuscation and gzip perform about the same as minifica- tion and gzip, another reason to just stick with minification and avoid the additional risks of obfuscation. In summary, the main numbers to compare are: • 85K: JavaScript size without JSMin and gzip compression • 68K: JavaScript size with only JSMin (21% savings) • 23K: JavaScript size with only gzip compression (73% savings) • 19K: JavaScript size with JSMin and gzip compression (78% savings) Table 10-5. Size reductions with JSMin and Dojo Compressor after gzip compression Web site Original size after gzip JSMin savings after gzip Dojo Compressor savings after gzip http://www.amazon.com 48K 7K (16%) 6K (13%) http://www.aol.com 16K 1K (8%) 1K (8%) http://www.cnn.com 29K 6K (19%) 6K (20%) http://www.myspace.com 23K 4K (19%) 4K (19%) http://www.wikipedia.org 13K 5K (37%) 5K (39%) http://www.youtube.com 10K 2K (19%) 2K (20%) Average 23K 4K (20%) 4K (20%)