The Closure toolset

The Closure set of tools are a set of five components that help in creating web applications. You can check out their page to see the five different components. What we're going to look at here though is what they address.

Closure Compiler

The Closure Compiler is perhaps the most interesting part when you first hear about the closure toolset. The compiler will take your javascript and minify it. There are already minifiers but the compiler actually parses your code and makes it better by doing things like code inlining. This means that your code will also run faster. The compiler will also do some great things like type checking to pick up errors that could turn around and bite you later. There are some rules though when you use the compiler which is effectively like using a subset of the language. Perhaps the biggest difference is that you can't mix bracket and dot notation (i.e. person.name != person['name']).

An interesting alternative for projects where you don't want to go down the path of using a subset of javascript is UglifyJS

Closure Library

The Closure Library is built to work well with the compiler. It may look huge to begin with but most of that is comments and when you build your project you only include the code you use as opposed to other libraries where you need to include either the entire file or entire modules on the page. The closure library will allow you to do DOM manipulation, ajax, gives you UI components and also takes care of dependancy management through the reps_writer - a python script that goes through and figures out what order javascript needs to be loaded on to the page.

There are many alternatives which you can use instead. Thes include JQuery & JQueryUI, YUI, Sencha (ExtJS) and Dojo.

The library also gives a testing framework which is similar to other test frameworks like QUnit, mocha or jasmine.

Closure Templates

The Closure Templates, or Soy work with both javascript and java which allows them to be used on the client and server side. You can include some logic in them and extend their functionality through java plugins.

other temptlating solutions that you might consider are mustache, JQuery template and jade

Closure Linter

The Closure Linter checks your code style to make sure it is always readable by other people in your group.

Alternatives are JSHint and Crockford's original JSLint

Linters are well known for hurting people's feelings - so be sure to run them often, you can even get JSHint as a plugin for Textmate.

Closure Stylesheets

The latest recent addition to the closure toolset is Closure Stylesheets. This allows you to to write CSS in a more programmatical way. One of the large benefits with Closure stylesheets is the minification and class renaming which can save even more bytes.

Alternatives are LESS and SASS and compass. You may still want a CSS minifier to use afterwards and you can use Yahoo's

So it's a pretty complete set of tools - the only thing that is really missing is a way to structure your code (and perhaps an IDE). Next blog article I'm going to take you through creating a local application which will be followed by posts about building and serving your application on a server. In those I will introduce you to Plovr and talk about creating a node proxy script so you can test pages "live".

I'd also recommend you pick up the Closure Definitive Guide, which you can also get on Amazon for your kindle.