Until now, I used the Revealing Module Pattern to structure my Javascript, like so:
var module = (function() {
var privateVar;
// @public
function publicFunction( ) {
}
return {
publicFunction: publicFunction
}
})();
Fiddle
Although this code works as expected, I read an article lately that this pattern uses a large amount of memory if you have multiple instances, and that it has some speed issues compared to other patterns. Since I enjoy working with this pattern, I did a search for similar patterns without all those "issues" and I came across the Revealing Prototype Pattern. As far as I know, JavaScript`s Prototype has a much better memory management.
Now I'm wondering if it's faster / better for memory to use the Revealing Prototype Pattern? This benchmark surprised me, because the Module Pattern seems to be much faster. Is there any reason?
Also, I couldn't figure out how to have multiple instances with the Revealing Prototype Pattern (compare to the Revealing Module Pattern Fiddle above):
var prototypeModule = function( el ) {
this.init( );
};
prototypeModule.prototype = function () {
var privateVar;
// @public
function init( ) {
}
return {
init: init
}
}();
Fiddle 2
What am I doing wrong?
Although this code works as expected I red an article lately that this pattern uses large amount of memory if you have multiple instances
The code you presented in your first snippet is a singleton module, there are no "multiple instances". It is completely fine.
Only the thing that you titled Module pattern - Multiple instances
in your fiddle does suffer from memory disadvantages when it instantiates a very large amount of objects. However, notice that this is not a "module pattern" but the "factory pattern".
Now I'm wondering if it's faster / better for memory to use the Revealing Prototype Pattern?
In general, and if applied correctly, yes.
This benchmark surprised me, because the Module Pattern seems to be much faster. Is there any reason?
The code of their modules is messed up beyond all repair. I'm not even trying to comment on what is going on there.
Also I couldn't figure out how to have multiple instances with the Revealing Prototype Pattern
The benefit of the prototype is that its properties are shared amongst all instances. This means that the .init
method of all instances points to the same function, which has a single privateVar
in its revealing module scope - this variable exists only once for all instances! It's static, not instance-specific.
If you want to use the prototype, you cannot access truly private variables; you will need to use public properties. However, your clickFunction
needs a local (private) variable anyway for its closure, so there would be nothing wrong with not using the prototype here:
function Constructor( el ) {
var privateVar = $( el );
privateVar.on( 'click', function clickFunction() {
privateVar.addClass('click');
});
console.log( 'constructor: ' + privateVar.attr('id') );
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With