Is a closure for dereferencing variables useful?

Question

I'm not sure whether or when it is useful (to improve performance) to dereference variables.

var x = a.b.c.d[some_key].f;
while (loop) {
    do_something_with(x);
}

seems to be better than

while (loop) {
    do_somthing_with(a.b.c.d[some_key].f);
}

Is that needed or is this done automagically by smart JavaScript engines?

But my actual question is whether I should do this, for example, in a library.

(function() {
    var slice = Array.prototype.slice;

    Function.prototype.x = function x() {
        var args = slice.call(arguments, 0);
        ...
    };
})();

or just

Function.prototype.x = function x() {
    var args = Array.prototype.slice.call(arguments, 0);
    ...
};

The engine can't improve this automatically because it doesn't know whether Array.prototype.slice might change during the run time.

So: does creating a closure for creating the local reference to the slice function make the script faster? Or does the additional closure scope make it slower than accessing the property "slice" of the property "prototype" of Array?

Answer 1

"Dereferencing" is actually a confusing word for that purpose. Its not that, you just cache some property/method in a local variable. It actually makes no difference whether you do it to access some property/method on a random object or do it with Array.prototype.slice. It makes a lot of sense as soon as you access those deeply nested properties more than once.

Tbh, "modern" browsers do optimize the access quite a lot. All modern js engines uses internal look-up tables to accessed properties. However, you still want to cache those deeply nested stuff since in older engines, it would go the whole way down through all involved objects to resolve it.

One more reason to use local cached references is, that even modern js engines won't use a hash-lookup as soon as some kind of explicit or implicit eval mechanism is used.

Especially Internet Explorer <9 and Firefox 3.5 incur a terrible performance penalty with each additional step into a (prototype) chain.

---

One word of caution: it is not very recommended to use local caching for object methods (like you do with the slice method). Many objects use this to determine the context in which they are beeing called. Storing a method in a local variable causes this to be bound to global object or null. So always make sure to call such a method with method.call to set the context manually.

Answer 2

If you intend to access a property more than once, consider assigning it to a local variable. However, for modern javascript engines such micro-optimisations will make very little difference, the most important thing thing is to write code that expresses your intent.