I just read this article http://javascriptweblog.wordpress.com/2011/05/31/a-fresh-look-at-javascript-mixins/.
In the section entitled "#4 Adding Caching" it says:
By forming a closure around the mixins we can cache the results of the initial definition run and the performance implications are outstanding.
I don't understand how this works-- how does using the module pattern here lead to a faster/cached version of the code?
basically, without using the closure, the mixin function will be created every time the mixin is used. By creating a closure, each of the function will be created once, and the mixin will reference those functions every time it is called. Since the mixin doesn't have to recreate those functions every time it runs, its faster.
without the closure
var asRectangle = function() {
// every time this function is called, these three functions are created
// from scratch, slowing down execution time
this.area = function() {
return this.length * this.width;
}
this.grow = function() {
this.length++, this.width++;
}
this.shrink = function() {
this.length--, this.width--;
}
})();
with the closure
var asRectangle = (function() {
// these functions are 'cached' in the closure
function area() {
return this.length * this.width;
}
function grow() {
this.length++, this.width++;
}
function shrink() {
this.length--, this.width--;
}
// this function is set to asRectangle. it references the above functions
// every time it is called without having to create new ones
return function() {
this.area = area;
this.grow = grow;
this.shrink = shrink;
return this;
};
})();
It's not the closure or the module pattern, but the result of it: the different constructor/mixin function. While
function mixin() {
this.method = function() { ... }
}
creates new closure scope for the method (the execution context of mixin, which contains no variables - but needs to be reserved in memory) on every call,
function method() { ... }
function mixin() {
this.method = method;
}
does only create one function living in only one scope (when applied multiple times).
The module pattern is used only to make the method a local variable.
In the second case only this code is executed: upon applying the mixin:
this.area = area;
this.grow = grow;
this.shrink = shrink;
return this;
While in the first case area,grow, and shrink are redefined for each and every asXXX call. The definition of the methods and their caching is done at "parsing" time of the mixin declaration in the second case and thus needs to be done only once.
