performance: variables inside object vs variables inside function

Question

I am creating a hybrid mobile application using javascript. In order to support multiple languages, I created an object called "exchange" that contains the translations of variables, where "exchange" contains more than 200 variable. My question is that in scale of performance, what's best to use:

1- variables inside object like this:

var exchange = {
    USERNAME_PASSWORD_UNMATCHED: "الاسم و كلمة المرور غير متطابقين",
    NOT_APPROVED: " بانتظار تأكيد صلاحية الوصف",
    ERROR_CONNECT: "فشل الاتصال بالخادم",
    RE_LOGIN: "الرجاء اعادة الدخول",
    INVALID_ACCESS_TOKEN: "رمز المرور غير صحيح",
.
.
.
};

or

2- variables inside function like this

 var exchange = {
    get_variable:function(name){
    switch(name){
        case "USERNAME_PASSWORD_UNMATCHED": return "الاسم و كلمة المرور غير متطابقين"; break;
        case "NOT_APPROVED":return " بانتظار تأكيد صلاحية الوصف";
        case "ERROR_CONNECT":return "فشل الاتصال بالخادم";
        case "RE_LOGIN":return "الرجاء اعادة الدخول";
        case "INVALID_ACCESS_TOKEN":return "رمز المرور غير صحيح";
    }
}
    };

The first thing is called "object properties", the second one uses string literals. The only variables you use are exchange and name. Notice also that you have a syntax error in your second example, it should be get_variable: function(name){; and those breaks after a return are unnecessary. — Bergi
– Bergi, Commented Apr 7, 2014 at 10:02
It depends what you want. If you want low memory usage, but higher CPU usage then use version 2. If you want low CPU usage but a little higher memory usage then use version 1. Do you check for this once? Then use version 2. Do you use this a lot? Then save yourself the CPU cycles and use version 1. — h2ooooooo
– h2ooooooo, Commented Apr 7, 2014 at 10:05
I would use object properties. Restoring static values via function doesn't make sense. Before caring about execution speed, unless you try to access these values 60 times a second, and maybe even then, there are a dozen other things to take care of first. — MildlySerious
– MildlySerious, Commented Apr 7, 2014 at 10:09

Mauno Vähä · Accepted Answer · 2014-04-07 10:47:03Z

I argue that with simple js structures like you provided, difference between the two is minimal. Although, I would prefer solution #1 over #2 because it is much simpler (to my eyes) and easy to access.

I also traced performance of the two with jsperf and there was practically, no difference.

You can view the results here: jsperf-exchange-translation-perf

Here is also the code used for test:

Preparation:

// Keys
var keys = [
   "USERNAME_PASSWORD_UNMATCHED",
   "NOT_APPROVED",
   "ERROR_CONNECT",
   "RE_LOGIN",
   "INVALID_ACCESS_TOKEN"
];

// Random number between keys range
var getRandomKey = function() {
    return Math.floor(Math.random() * ((keys.length - 1) - 0 + 1)) + 0;
};

Test case #1:

var exchange = {
    USERNAME_PASSWORD_UNMATCHED: "الاسم و كلمة المرور غير متطابقين",
    NOT_APPROVED: " بانتظار تأكيد صلاحية الوصف",
    ERROR_CONNECT: "فشل الاتصال بالخادم",
    RE_LOGIN: "الرجاء اعادة الدخول",
    INVALID_ACCESS_TOKEN: "رمز المرور غير صحيح"
};

for(var i = 0; i < 10000; i++) {
   console.log(exchange[getRandomKey()]);
}

Test case #2:

var exchange = {
    get_variable:function(name){
    switch(name){
        case "USERNAME_PASSWORD_UNMATCHED": return "الاسم و كلمة المرور غير متطابقين"; break;
        case "NOT_APPROVED":return " بانتظار تأكيد صلاحية الوصف"; break;
        case "ERROR_CONNECT":return "فشل الاتصال بالخادم"; break;
        case "RE_LOGIN":return "الرجاء اعادة الدخول"; break;
        case "INVALID_ACCESS_TOKEN":return "رمز المرور غير صحيح";
    }
    }
};

for(var i = 0; i < 10000; i++) {
   console.log(exchange.get_variable(getRandomKey()));
}

Results:

Test case #1:

2.51 ops/sec

Test case #2:

2.46 ops/sec

Special note: Because I used console.log etc. There is a possibility that jsperf will return different results based on the traffic the CPU has which is performing the tests. Running tests multiple times reveals that there is much variance.

So I would conclude by saying, the access performance of the solution doesn't make much difference, but using solution #1 over #2 would make sense because the latter only complicates retrieval of object values which is easy in javascript by default using exchange["USERNAME_PASSWORD_UNMATCHED"]

Thanks for you candy answer, note that I am using this code on a mobile application, so the 10 % cost a lot. Thanks again

Collectives™ on Stack Overflow

performance: variables inside object vs variables inside function

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related