Forums » Help » Google Closure Compiler - ADVANCED_OPTIMIZATIONS results in error

There's a lot of talk about impact's baking + google closure compiler:

http://impactjs.com/forums/search/closure

I've combined the two as well and have found that the google closure compiler's SIMPLE_OPTIMIZATIONS setting for compilation_level works great on impact's game.min.js file after baking.

However, as you can see here:

Example Javascript:

function unusedFunction(note) {
  alert(note['text']);
}

function displayNoteTitle(note) {
  alert(note['title']);
}

var flowerNote = {};
flowerNote['title'] = "Flowers";
displayNoteTitle(flowerNote);

Compilation with SIMPLE_OPTIMIZATIONS shortens the code to this:

function unusedFunction(a){alert(a.text)}function displayNoteTitle(a){alert(a.title)}var flowerNote={};flowerNote.title="Flowers";displayNoteTitle(flowerNote);

Compilation with ADVANCED_OPTIMIZATIONS shortens the code even further to this:

var a={};a.title="Flowers";alert(a.title);

the ADVANCED_OPTIMIZATIONS flag would add a huge level of obfuscation which, for me, creates an enormous benefit in protecting the source code. Unfortunately, when I compile with ADVANCED_OPTIMIZATIONS I get an "ig is not defined" error when I run my game... *tear.

Has anyone successfully compiled against ADVANCED_OPTIMIZATIONS? If not, any chance the impact engine could be changed to support that flag?

here's the code surrounding the bug:

From Baked: (this works in chrome)

// lib/impact/image.js
ig.baked=true; //line 369

From Closure Compiler with: SIMPLE_OPTIMIZATIONS (this works in chrome)

ig.baked=!0; // line 262

From Closure Compiler with ADVANCED_OPTIMIZATIONS (this does not work, gives error on line 258)

ig.j=g; //line 258, error is Uncaught ReferenceError: ig is not defined (anonymous function)
ig.m("impact.image").l(function(){

<Feeling awkward following up on this 7 months later>

I'm not even able to compile (simple optimizations) a simple impact baked game (game.min.js). Upon failure, the compiler suggests the exporting of some functions.

This is unfamiliar territory for me, but isn't there some sort of Javascript concatenation build tool you could use? My guess is use that to create a single js file, and then send it through the Closure advanced compilation. From there you can include the compiled js in your index.html and bake it.

So in essence: compile first, then bake vs. bake first, then compile.

Good idea @quid. I'll try this with grunt. Thanks!

I just ran into this same issue today using ADVANCED_OPTIMIZATIONS with closure compiler. When I run my game in the browser I get "ig is undefined". It seems that closure optimized this variable out. Possibly other variables too. Anybody have any luck getting theirs to run? I'm not sure how much work this will be trying to get my game to play nice with closure.

I'm mainly interested in the obsfucation that closure gives. If there is another obsfucation tool I can use instead that "just works", I'll be glad to try it.

You should check out UglifyJS, see if that works for you.

Are you exporting the ig global variable? Are you compiling your code together with the Impact JS files?

Thanks for the suggestions...I actually got it 99% working by simply replacing all "ig" in the code base with "window.ig" and it worked great! Well, except for one issue...

The issue which only happens when when using closure BUT it seems like I can fix if I just new JavaScript a little better.

I get back a response from a server and I create an new object (by using new) and I create a "Data" variable by setting newObject.Data equal to the response I got back. When I do "console.log(newObject.Data) it prints out correctly, printing out all the data in the response for example:

payout: "0.00"
lines: "3"

But when I try to print out the individual payout variable using "console.log(newObject.Data.payout)" it is undefined. This works when not using closure so I'm really perplexed. I don't understand why it prints out correctly when logging the Data variable but not correctly when I try to print a particular variable in that Data.

This is probably a nuance of JavaScript that I just haven't learned yet about how this data is represented. Any help is greatly appreciated.

In case this helps anyone else, I figured it out...

event.Data.payout no longer works but...

event.Data['payout'] does work.

When you use variables within quotes, closure doesn't optimize them, so I think it must have been changing event.Data.payout to event.Data.a for example and failing.

So, in summary, closure works great for my project. Reducing from 109KB to 64KB and obfuscating it pretty well.

Cheers!

Has anyone been able to get the Google Closure Compiler to work with impact and ADVANCED_OPTIMIZATIONS, without hacking the code? (ie ig. -> window.ig)?

I think you need to modify impact.js source in order to make it compatible to ADVANCED_OPTIMIZATIONS.

It's not necessary to replace ig with window.ig in every instance.
I already posted about my approach here:
http://impactjs.com/forums/private/closure-compiler

Nice! Thanks lachsen, I'll try that next time I grab a new ImpactJS version