Google’s Closure Compiler
SpeedBy Gail Seymour
The Google Closure Compiler is one of the latest tools released by Google in its never-ending quest for enhanced user experience. Unlike iGoogle and Google apps, the Closure Compiler is not aimed at the end user though. Instead it is one of the suite of tools designed to help Web developers create faster, cleaner code. That’s because Google has started including page speed as one of it’s ranking criteria, in recognition of the fact Web users don’t want to sit around waiting for pages to download.
What does Google Closure Compiler do?
The Closure Compiler takes JavaScript code and optimizes it. It can be used to check for syntax errors and other “common JavaScript pitfalls,” and to condense the code. There are three levels of compression:
- WHITESPACE_ONLY will remove whitespace and comments.
- SIMPLE_OPTIMIZATIONS the default setting, renames local variables as well as whitespace and comments.
- ADVANCED_OPTIMIZATIONS will further compress code by renaming symbols and global variables, but could break scripts which are spread across multiple files unless all code is compiled together and other steps are taken to ensure calls to third party scripts are protected.
Thus, the Closure Compiler, when used with the Closure Library and Closure Templates are designed to “create and maintain efficient JavaScript code that downloads quickly and works across different browsers.”
In effect the closure tools allows you to piggy back on Google’s extensive JavaScript library to develop your own Web applications.
How can I use the Closure Compiler?
It can be run from the User Interface (UI) at http://closure-compiler.appspot.com/home, or by connecting a Web page of your own directly to the application programming interface (API). See Getting Started with the API and Closure Compiler Service API Reference to get started compiling your own code. You can also download the Closure Compiler Application to run on your own computer as a java command line utility.
Issues with Closure Compiler
Although the Closure Compiler turns out cleaner more efficient code, there have been concerns raised among Web developers that it may deter new developers from learning about coding by viewing the source code of web pages and de-constructing the scripts, as discussed on webmonkey.
The problem is where human developers tend to name variables in a self explanatory manner, to make keeping track of them easier, such as “UserName”, the Closure Compiler strips these names out replacing them with a single letter “a” making the output less human friendly. Where the ADVANCED_OPTIMIZATIONS option is used and function names and symbols are replaced with shorter code, the task of deciphering them becomes even harder for the inexperienced but curious coder. It’s a trade off. Machine friendly, faster code is inherently less human friendly.
That’s where the Closure Library and Closure Templates come in. New developers can download the full suite of closure tools and follow the tutorials to learn how to build applications cleanly. Experienced developers can exploit the extensive library to improve their programming and use the closure compiler to bring their own JavaScripts in line with Google’s own coding practices. Perhaps the hardest adjustment will be for intermediate programmers who have already learned some coding skills from viewing other developers’ source code, but have yet to really “get” coding from the ground up.
About the Author
Gail Seymour has been a Web site designer for more than 10 years. During that time she has won three design awards, and has provided the content and copy for dozens of Web sites and more than 50,000 Web pages.
Dear Gail,
Thanks for an informative article on Closure Compiler, their JS libraries and templates. I have a couple of questions to ask yoo.
It looks like Google is or has evolved its own JavaScript coding and development std. Do you know any references to their coding or JS Best practices?
Do you know any relationship between the Google Web Toolkit compiler and the closue compiler. The GWT compiler is a compiler-compiler which translates Java ot JavaScript code and browser It also does minify and obfuscates and compresses it?
Any clarification will be very helpful.
Thanks
GL
908-607-8791
DO you know how it derives its obfuscation
Hi GL,
Thank you for your questions. Google released a video going over best practices for developing with GWT. You can find it here: http://code.google.com/events/io/2009/sessions/GoogleWebToolkitBestPractices.html
As for the differences between CC and GWT, this post should clarify it for you: http://groups.google.com/group/google-web-toolkit/msg/58ae2ec5d5fd79e1
I hope that helps!