obfuscate

jscramble logo

I was looking for what HTML5 game developers do to protect their source codes. Coincidentally, Emanuale Feronato made post last week about JScrambler, which seems to be the state-of-the-art of free tools in protection forĀ  Javascript codes.

Protecting your code is important for several reasons. Javascript is an interpreted client-side language, which means that the browser of the final user will read the code and execute it to run the game, and this same code can be accessed by the user simply looking in the page source code.

Now, suppose that your code is neither minified or obfuscated. In this case, the final user will see the exactly the lines you wrote. With this, he can: copy and modify all components of your game with the minimum effort and re-distributed as a completely new one; hack your code to submit scores without even playing your game; among other undesirable things.

Notice that, as Javascript runs in client-side, there is no real way to avoid the user to see your code and to stop him to try to decode it. But, you can make your code as harder as possible to decode. This is what JScrambler do, makes your code hard to read, to copy, to modify, and to redistribute without your permission.

Look at the following example. The code below is a function that merges two different objects, just like jQuery do:

(function() {
    
    "use strict";

    var merge = function() {
        var obj, name, copy,
            target = arguments[0] || {},
            i = 1,
            length = arguments.length;

        for (; i < length; i++) {
            if ((obj = arguments[i]) != null) {
                for (name in obj) {
                    copy = obj[name];

                    if (target === copy) {
                        continue;
                    }
                    else if (copy !== undefined) {
                        target[name] = copy;
                    }
                }
            }
        }

        return target;
    };

window.merge = merge;
}());

Using JScrambler you get:

var I2Y={'n':function(Y,R){return Y!=R;},'g':function(Y,R){return Y===R;},'H':function(Y,R){return Y!==R;},'d':(function(J){return (function(N,G){return (function(k){return {I:k};})(function(W){var V,j=0;for(var M=N;j<W["length"];j++){var e=G(W,j);V=j===0?e:V^e;}return V?M:!M;});})((function(S,Z,v,U){var O=26;return S(J,O)-U(Z,v)>O;})(parseInt,Date,(function(Z){return (''+Z)["substring"](1,(Z+'')["length"]-1);})('_getTime2'),function(Z,v){return new Z()[v]();}),function(W,j){var B=parseInt(W["charAt"](j),16)["toString"](2);return B["charAt"](B["length"]-1);});})('6i2bf2j20'),'t':function(Y,R){return Y<R;}};(function(){var h=I2Y.d.I("fe3d")?"use strict":"merge",z=I2Y.d.I("a6")?null:function(){var R=I2Y.d.I("b2")?"H":"target";var A=I2Y.d.I("f1")?"length":"g";var c=I2Y.d.I("8858")?null:"length";var p=I2Y.d.I("b331")?"target":"n";var E=I2Y.d.I("2c3")?"t":"obj";var P=I2Y.d.I("abf8")?"target":"length";var L=I2Y.d.I("dcf")?null:1;var s=I2Y.d.I("74")?0:null;var X,o,l,b=arguments[s]||{},q=I2Y.d.I("36")?L:"length",T=I2Y.d.I("cbb4")?"obj":arguments[P];for(;I2Y[E](q,T);q++){if(I2Y[p]((X=arguments[q]),c)){for(o in X){var w=function(Y){l=Y[o];};w(X);if(I2Y[A](b,l)){continue;}else if(I2Y[R](l,undefined)){var D=function(Y){b[o]=Y;};D(l);}}}}return b;},u=function(Y){var R="merge";window[R]=Y;};h;u(z);}());
Read more