mixin fun
JavaScript performance comparison
Preparation code
<script>
//1
var circleFns = {
area: function() {
return Math.PI * this.radius * this.radius;
},
grow: function() {
this.radius++;
},
shrink: function() {
this.radius;
}
}
//2
var asCircle = function() {
this.area = function() {
return Math.PI * this.radius * this.radius;
};
this.grow = function() {
this.radius++;
};
this.shrink = function() {
this.radius;
};
}
//3
var asCircleCached = (function() {
var area = function() {
return Math.PI * this.radius * this.radius;
};
var grow = function() {
this.radius++;
};
var shrink = function() {
this.radius;
};
return function() {
this.area = area, this.grow = grow, this.shrink = shrink;
}
})();
var asCircleCached2 = (function() {
var area = function() {
return Math.PI * this.radius * this.radius;
};
var grow = function() {
this.radius++;
};
var shrink = function() {
this.radius;
};
return function() {
this.area = area, this.grow = grow, this.shrink = shrink;
}
}());
//4
Function.prototype.curry = function() {
var fn = this;
var args = [].slice.call(arguments, 0);
return function() {
return fn.apply(this, args.concat([].slice.call(arguments, 0)));
}
}
//4
var asCircleCachedAndCurried = (function() {
var area = function() {
return Math.PI * this.radius * this.radius;
};
var grow = function(growBy) {
this.radius += growBy;
};
var shrink = function(shrinkBy) {
this.radius = shrinkBy;
};
return function(options) {
this.area = area, this.grow = grow.curry(options['growBy']), this.shrink = shrink.curry(options['shrinkBy'])
}
})();
//5
var asCircleWithOptions = function(options) {
this.area = function() {
return Math.PI * this.radius * this.radius;
};
this.grow = function() {
this.radius += options.growBy;
};
this.shrink = function() {
this.radius = options.shrinkBy;
};
}
//set up test constructors (one for each case to ensure fresh prototypes each time)
var CircularObject1 = function(radius) {
this.radius = radius
};
var CircularObject2 = function(radius) {
this.radius = radius
};
var CircularObject3 = function(radius) {
this.radius = radius
};
var CircularObject4 = function(radius) {
this.radius = radius
};
var CircularObject5 = function(radius) {
this.radius = radius
};
var CircularObject6 = function(radius) {
this.radius = radius
};
</script>
Test runner
Warning! For accurate results, please disable Firebug before running the tests. (Why?)
Java applet disabled.
Test  Ops/sec  

old style 

pending… 
new style 

pending… 
new style w/ caching 

pending… 
new style w/caching and options 

pending… 
new style uncached w/options 

pending… 
new style w/ caching2 

pending… 
Compare results of other browsers
Revisions
You can edit these tests or add even more tests to this page by appending /edit
to the URL. Here’s a list of current revisions for this page:
 Revision 2: published by Angus
 Revision 3: published
 Revision 4: published by Jie
 Revision 5: published by Angus
 Revision 10: published by ejones
 Revision 11: published by Angus
 Revision 12: published by Angus
 Revision 13: published
 Revision 14: published by furf
 Revision 15: published
 Revision 16: published
 Revision 17: published
 Revision 18: published
 Revision 19: published
 Revision 20: published
 Revision 25: published by Ash Heskes
 Revision 26: published
 Revision 28: published
 Revision 31: published
 Revision 33: published by Joe Fiorini
 Revision 34: published
 Revision 37: published
 Revision 41: published by Andrey
 Revision 42: published
 Revision 43: published
 Revision 45: published
 Revision 46: published
 Revision 52: published
0 comments