Home

As part of the series exploring the internals of Google Closure Compiler, this time we are diving into one of the many optimizations that it does, the peephole optimization.

The code itself describes peephole optimizations as:

optimizations that look at a small section of code and either remove that code (if it is not needed) or replaces it with smaller code.

And from Wikipedia

In compiler theory, peephole optimization is a kind of optimization performed over a very small set of instructions in a segment of generated code. The set is called a > "peephole" or a "window". It works by recognising sets of instructions that can be replaced by shorter or faster sets of instructions.

Let's try an example:

var x = 1 + 2;

This would be completely correct if it were written as

 var x = 3;

And it's easy to verify so!

This is a particular kind of peephole optimization that known as "contant folding", which has an entire wiki page dedicated.

To quote what Wikipedia has to say about constant folding:

Constant folding is the process of recognizing and evaluating constant expressions at compile time rather than computing them at runtime.

It's about getting results event before running any code! I think of it as being similar to static typing, where you can prove correctness without running the code.

The Wiki page gives more examples of constant folding that a compiler may do, including:

We can find out if the closure compiler does such folding:

var z = 0 * 10; gets compiled to var z = 0.

And, probably unsurprisingly, var s = "abc" + "def" gets compiled to var s = "abcdefg".

A more advanced optimization is Constant Propagation. This is when values of expressions are known during the compilation stage, because they are constant, and can be substituted.

For example, this code:

var x = 10;
var z = x * 2;

will be compiled down to

var x=10,z=20;

However to get this using the closure compiler, you have to turn on advanced optimizations, the instructions are here.

If you tried this and got and empty file, chances are that the compiler eliminated all code in the dead code elimination pass, where unused code is just thrown away. This is another compilation pass that is enabled when you turn on advanced optimizations.

In this case you can just add a stray log statement to ensure that the variable is used, like so:

var x = 10;
var z = x * 2;
console.log(z);

and you should see, console.log(20). Pretty crazy optimizations huh?

Here are the peephole optimizations that the closure compiler has:

List of peephole optimizations in closure compiler

List of peephole optimizations in closure compiler

Why would anyone write code like this?

When I first saw this example, I was thinking to myself, would people even write such code? And almost immediately I realized that I was guilty of this!

When building websites, I often use the setInterval and setTimeout functions. Both of these functions take as their first argument a callback function, and the second argument is a time duration in milliseconds. For example,

setInterval(function() {
    alert('Hi!');
}, 5000);

Would set off an alert saying 'Hi!' every 5 seconds. It isn't that hard seeing that 5000ms is 5 seconds... Or you could write it like this:

setInterval(function() {
    alert('Hi!');
}, 5 * 1000);

This makes the 5 extremely obvious.

When more complicated calculations are involved:

SECONDS_IN_DAY = 24 * 60 * 60

It's nice knowing that it will be compiled down to SECONDS_IN_DAY=86400.