High Performance Web Sites

Chapter 12. Rule 10: Minify JavaScript

JavaScript, being an interpreted language, is great for building web pages. Interpreted languages excel when developing user interfaces where rapid prototyping is the norm. Without a compilation step, though, the responsibility falls on the frontend engineer to optimize the JavaScript before final deployment. One aspect of this, gzipping, is discussed in Chapter 6. In this chapter, I describe another step that should be integrated into the JavaScript deployment process: minification.

Minification

Minification is the practice of removing unnecessary characters from code to reduce its size, thereby improving load times. When code is minified, all comments are removed, as well as unneeded whitespace characters (space, newline, and tab). In the case of JavaScript, this improves response time performance because the size of the downloaded file is reduced.

Table 12-1 shows how many of the 10 top U.S. web sites practice JavaScript minification— 4 out of 10 minify their JavaScript code.

Table 12-1. Minification practices across 10 top web sites

Web site	External scripts minified?
http://www.amazon.com/	No
http://www.aol.com/	No
http://www.cnn.com/	No
http://www.ebay.com	Yes
http://froogle.google.com/	Yes
http://www.msn.com/	Yes
http://www.myspace.com/	No
http://www.wikipedia.org/	No
http://www.yahoo.com/	Yes
http://www.youtube.com/	No

Let's look at what the others could have saved if they had minified. But first, I need to mention a more aggressive alternative to minification: ...