Solution to minify object properties?

Question

In my JavaScript application, I use several objects for internal purposes only (the users don't need to access them). for example:

var images={
    blank:"blank.gif",
    plus:"plus.gif",
    minus:"minus.gif"
}

When I use a minifier like Uglify.js, the property names (blank, plus, minus) are kept as is. Is there a way to minify them?

What I have considered so far:

• use Google Closure minifier in advanced mode, but this crushes my code
• replace object properties with variables (e.g. var imagesBlank="blank.gif") but it makes the code less readable

Is there a better way?

Answer 1

Using an object allows the use of variables as properties. Wrapping it in a closure makes those variables worthy of minifying.

//Wrap in closure
(function() {

    //Property Variables
    var blank = 0;
    var plus  = 1;
    var minus = 2;

    //Define Object
    var image = [];
    image[blank] = "blank.gif";
    image[plus]  = "plus.gif";
    image[minus] = "minus.gif";

    //Accessors - must be within closure
    image[blank]; //blank.gif
    image[plus];  //plus.gif
    image[minus]; //minus.gif

})();

To access the values above, the constants must be used within the closure.

If using Google's Closure Compiler, using var image = []; will be more efficient in declaring the array since the property values are numbered from zero, i.e. 0, 1, 2.

Otherwise, var image = {}; works well too.