JavaScript Object Oriented Libraries Benchmark
JavaScript performance comparison
Preparation code
<script src="https://rawgithub.com/nicolas-van/ring.js/master/underscore.js" type="text/javascript"></script>
<script src="https://rawgithub.com/nicolas-van/ring.js/master/ring.js" type="text/javascript"></script>
<script src="http://dl.dropbox.com/u/7677927/oop-benchmark/lib/jsface.js">
</script>
<script src="http://dl.dropbox.com/u/7677927/oop-benchmark/lib/my.class.js">
</script>
<script src="http://dl.dropbox.com/u/7677927/oop-benchmark/lib/jrclass.js">
</script>
<script src="http://dl.dropbox.com/u/7677927/oop-benchmark/lib/klass.js">
</script>
<script src="http://dl.dropbox.com/u/7677927/oop-benchmark/lib/classy.js">
</script>
<script src="http://dl.dropbox.com/u/7677927/oop-benchmark/lib/ptclass.js">
</script>
<script src="https://rawgithub.com/javascript/augment/master/lib/augment.js">
</script>
<script src="http://cdn.sencha.com/ext-4.1.1a-gpl/builds/ext-foundation.js">
</script>
<script src="https://rawgithub.com/torworx/ovy/master/ovy.js">
</script>
<script src="http://indigounited.com/dejavu/dejavu.js">
</script>
<script src="https://rawgithub.com/jayferd/pjs/master/src/p.js"></script>
<script src="https://rawgithub.com/weikinhuang/Classify/master/dist/classify.js"></script>
<script src="https://rawgithub.com/google/traceur-compiler/master/bin/traceur.js"></script>
<script src="http://raptorjs.org/dist/raptor.min.js" type="text/javascript"></script>
<script>
var RingPerson = ring.create({
init: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var RingFrenchGuy = ring.create([RingPerson], {
init: function(name) {
this.$super(name);
},
setAddress: function(city, street) {
this.$super('France', city, street);
}
});
var RingParisLover = ring.create([RingFrenchGuy], {
init: function(name) {
this.$super(name);
},
setAddress: function(street) {
this.$super('Paris', street);
}
});
</script>
<script>
var __hasProp = {}.hasOwnProperty,
__extends = function(child, parent) {
for (var key in parent) {
if (__hasProp.call(parent, key)) child[key] = parent[key];
}
function ctor() {
this.constructor = child;
}
ctor.prototype = parent.prototype;
child.prototype = new ctor();
child.__super__ = parent.prototype;
return child;
};
var JSFacePerson = jsface.Class({
constructor: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var JSFaceFrenchGuy = jsface.Class(JSFacePerson, {
constructor: function(name) {
JSFaceFrenchGuy.$super.call(this, name);
},
setAddress: function(city, street) {
JSFaceFrenchGuy.$superp.setAddress.call(this, 'France', city, street);
}
});
var JSFaceParisLover = jsface.Class(JSFaceFrenchGuy, {
constructor: function(name) {
JSFaceParisLover.$super.call(this, name);
},
setAddress: function(street) {
JSFaceParisLover.$superp.setAddress.call(this, 'Paris', street);
}
});
</script>
<script>
var MyPerson = my.Class({
constructor: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var MyFrenchGuy = my.Class(MyPerson, {
constructor: function(name) {
MyFrenchGuy.Super.call(this, name);
},
setAddress: function(city, street) {
MyFrenchGuy.Super.prototype.setAddress.call(this, 'France', city, street);
}
});
var MyParisLover = my.Class(MyFrenchGuy, {
constructor: function(name) {
MyParisLover.Super.call(this, name);
},
setAddress: function(street) {
MyParisLover.Super.prototype.setAddress.call(this, 'Paris', street);
}
});
</script>
<script>
var JRPerson = JRClass.extend({
init: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
},
sayHello: function() {
console.log('I am ' + this.name + '. My address is ' + this.country + ', ' + this.city + ', ' + this.street + '.');
}
});
var JRFrenchGuy = JRPerson.extend({
init: function(name) {
this._super(name);
},
setAddress: function(city, street) {
this._super('France', city, street);
}
});
var JRParisLover = JRFrenchGuy.extend({
init: function(name) {
this._super(name);
},
setAddress: function(street) {
this._super('Paris', street);
}
});
</script>
<script>
var EnderPerson = klass(function(name) {
this.name = name;
}).methods({
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var EnderFrenchGuy = EnderPerson.extend(function(name) {}).methods({
setAddress: function(city, street) {
this.supr('France', city, street);
}
});
var EnderParisLover = EnderFrenchGuy.extend(function(name) {}).methods({
setAddress: function(street) {
this.supr('Paris', street);
}
});
</script>
<script>
var ClassyPerson = Classy.$extend({
__init__: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var ClassyFrenchGuy = ClassyPerson.$extend({
__init__: function(name) {
this.$super(name);
},
setAddress: function(city, street) {
this.$super('France', city, street);
}
});
var ClassyParisLover = ClassyFrenchGuy.$extend({
__init__: function(name) {
this.$super(name);
},
setAddress: function(street) {
this.$super('Paris', street);
}
});
</script>
<script>
var PTClassPerson = PTClass.create({
initialize: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var PTClassFrenchGuy = PTClass.create(PTClassPerson, {
initialize: function($super, name) {
$super(name);
},
setAddress: function($super, city, street) {
$super('France', city, street);
}
});
var PTClassParisLover = PTClass.create(PTClassFrenchGuy, {
initialize: function($super, name) {
$super(name);
},
setAddress: function($super, street) {
$super('Paris', street);
}
});
</script>
<script>
var CoffeePerson = (function() {
function CoffeePerson(name) {
this.name = name;
}
CoffeePerson.prototype.setAddress = function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
};
return CoffeePerson;
})();
var CoffeeFrenchGuy = (function(_super) {
__extends(CoffeeFrenchGuy, _super);
function CoffeeFrenchGuy(name) {
CoffeeFrenchGuy.__super__.constructor.call(this, name);
}
CoffeeFrenchGuy.prototype.setAddress = function(city, street) {
return CoffeeFrenchGuy.__super__.setAddress.call(this, "France", city, street);
};
return CoffeeFrenchGuy;
})(CoffeePerson);
var CoffeeParisLover = (function(_super) {
__extends(CoffeeParisLover, _super);
function CoffeeParisLover(name) {
CoffeeParisLover.__super__.constructor.call(this, name);
}
CoffeeParisLover.prototype.setAddress = function(street) {
return CoffeeParisLover.__super__.setAddress.call(this, "Paris", street);
};
return CoffeeParisLover;
})(CoffeeFrenchGuy);
</script>
<script>
Ext.define('ExtPerson', {
constructor: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
Ext.define('ExtChinaGuy', {
extend: 'ExtPerson',
constructor: function() {
this.callParent(arguments);
},
setAddress: function(city, street) {
this.callParent(['China', city, street]);
}
});
Ext.define('ExtBeiJingLover', {
extend: 'ExtChinaGuy',
constructor: function(name) {
this.callParent(arguments);
},
setAddress: function(street) {
this.callParent(['BeiJing', street]);
}
});
</script>
<script>
var dejavuClassPerson = dejavu.Class.declare({
initialize: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var dejavuClassFrenchGuy = dejavu.Class.declare({
$extends: dejavuClassPerson,
initialize: function(name) {
this.$super(name);
},
setAddress: function(city, street) {
this.$super('France', city, street);
}
});
var dejavuClassParisLover = dejavu.Class.declare({
$extends: dejavuClassFrenchGuy,
initialize: function(name) {
this.$super(name);
},
setAddress: function(street) {
this.$super('Paris', street);
}
});
</script>
<script>
var dejavuClassPerson2 = dejavu.Class.declare({
initialize: function(name){
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
}, true);
var dejavuClassFrenchGuy2 = dejavu.Class.declare({
$extends: dejavuClassPerson2,
initialize: function (name) {
dejavuClassPerson2.call(this, name);
},
setAddress: function(city, street) {
dejavuClassPerson2.prototype.setAddress.call(this, 'France', city, street);
}
}, true);
var dejavuClassParisLover2 = dejavu.Class.declare({
$extends: dejavuClassFrenchGuy2,
initialize: function (name) {
dejavuClassFrenchGuy2.call(this, name);
},
setAddress: function(street) {
dejavuClassFrenchGuy2.prototype.setAddress.call(this, 'Paris', street);
}
}, true);
</script>
<script>
var dejavuClassPerson3 = dejavu.Class.declare(function () {
return {
initialize: function(name){
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
};
}, true);
var dejavuClassFrenchGuy3 = dejavuClassPerson3.extend(function ($super) {
var initialize = $super.initialize;
var setAddress = $super.setAddress;
return {
initialize: function(name){
initialize.call(name);
},
setAddress: function(city, street) {
setAddress.call(this, 'France', city, street);
}
};
}, true);
var dejavuClassParisLover3 = dejavuClassFrenchGuy3.extend(function ($super) {
var initialize = $super.initialize;
var setAddress = $super.setAddress;
return {
initialize: function(name){
initialize.call(name);
},
setAddress: function(street) {
setAddress.call(this, 'Paris', street);
}
};
}, true);
</script>
<script>
var OvyPerson = Ovy.define({
constructor: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var OvyChinaGuy = Ovy.define({
extend: OvyPerson,
constructor: function(name) {
OvyChinaGuy.$superclass.call(this, name)
},
setAddress: function(city, street) {
OvyChinaGuy.$super.setAddress.call(this, 'China', city, street);
}
});
var OvyBeijingLover = Ovy.define({
extend: OvyChinaGuy,
constructor: function(name) {
OvyBeijingLover.$superclass.call(this, name);
},
setAddress: function(street) {
OvyBeijingLover.$super.setAddress.call(this, 'Beijing', street);
}
});
</script>
<script>
var AugmentPerson = Object.augment(function() {
this.constructor = function (name) {
this.name = name;
};
this.setAddress = function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
};
});
var AugmentFrenchGuy = AugmentPerson.augment(function(base) {
var setAddress = base.setAddress;
this.constructor = function (name) {
AugmentPerson.call(this, name);
};
this.setAddress = function(city, street) {
setAddress.call(this, "France", city, street);
};
});
var AugmentParisLover = AugmentFrenchGuy.augment(function(base) {
var setAddress = base.setAddress;
this.constructor = function (name) {
AugmentFrenchGuy.call(this, name);
};
this.setAddress = function(street) {
setAddress.call(this, "Paris", street);
};
});
</script>
<script>
var PPerson = P(function(proto) {
proto.init = function (name) {
this.name = name;
};
proto.setAddress = function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
};
});
var PFrenchGuy = P(PPerson, function(proto, person) {
var setAddress = person.setAddress;
proto.init = function (name) {
PPerson.call(this, name);
};
proto.setAddress = function(city, street) {
setAddress.call(this, "France", city, street);
};
});
var PParisLover = P(PFrenchGuy, function(proto, frenchGuy) {
var setAddress = frenchGuy.setAddress;
proto.init = function (name) {
PFrenchGuy.call(this, name);
};
proto.setAddress = function(street) {
setAddress.call(this, "Paris", street);
};
});
</script>
<script>
var ClassifyPerson = Classify({
init: function (name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var ClassifyFrenchGuy = Classify(ClassifyPerson, {
init: function (name) {
this.parent(name);
},
setAddress: function(city, street) {
this.parent("France", city, street);
}
});
var ClassifyParisLover = Classify(ClassifyFrenchGuy, {
init: function (name) {
this.parent(name);
},
setAddress: function(street) {
this.parent("Paris", street);
}
});
</script>
<script>
var $__getDescriptors = function(object) {
var descriptors = {}, name, names = Object.getOwnPropertyNames(object);
for (var i = 0; i < names.length; i++) {
var name = names[i];
descriptors[name] = Object.getOwnPropertyDescriptor(object, name);
}
return descriptors;
}, $__createClassNoExtends = function(object, staticObject) {
var ctor = object.constructor;
Object.defineProperty(object, 'constructor', {enumerable: false});
ctor.prototype = object;
Object.defineProperties(ctor, $__getDescriptors(staticObject));
return ctor;
}, $__superDescriptor = function(proto, name) {
if (!proto) throw new TypeError('super is null');
return Object.getPropertyDescriptor(proto, name);
}, $__superCall = function(self, proto, name, args) {
var descriptor = $__superDescriptor(proto, name);
if (descriptor) {
if ('value'in descriptor) return descriptor.value.apply(self, args);
if (descriptor.get) return descriptor.get.call(self).apply(self, args);
}
throw new TypeError("Object has no method '" + name + "'.");
}, $__getProtoParent = function(superClass) {
if (typeof superClass === 'function') {
var prototype = superClass.prototype;
if (Object(prototype) === prototype || prototype === null) return superClass.prototype;
}
if (superClass === null) return null;
throw new TypeError();
}, $__createClass = function(object, staticObject, protoParent, superClass, hasConstructor) {
var ctor = object.constructor;
if (typeof superClass === 'function') ctor.__proto__ = superClass;
if (!hasConstructor && protoParent === null) ctor = object.constructor = function() {};
var descriptors = $__getDescriptors(object);
descriptors.constructor.enumerable = false;
ctor.prototype = Object.create(protoParent, descriptors);
Object.defineProperties(ctor, $__getDescriptors(staticObject));
return ctor;
};
</script>
<script>
var RaptorPerson = define.Class({
init: function(name) {
this.name = name;
},
setAddress: function(country, city, street) {
this.country = country;
this.city = city;
this.street = street;
}
});
var RaptorFrenchGuy = define.Class({superclass: RaptorPerson}, ['super'], function($super) {
var superCtor = $super.constructor;
var superSetAddress = $super.setAddress;
function RaptorFrenchGuy(name) {
superCtor.call(this, name);
};
RaptorFrenchGuy.prototype = {
setAddress: function(city, street) {
superSetAddress.call(this, 'France', city, street);
}
}
return RaptorFrenchGuy;
});
var RaptorParisLover = define.Class({superclass: RaptorFrenchGuy}, ['super'], function($super) {
var superCtor = $super.constructor;
var superSetAddress = $super.setAddress;
function RaptorParisLover(name) {
superCtor.call(this, name);
};
RaptorParisLover.prototype = {
setAddress: function(street) {
superSetAddress.call(this, 'Paris', street);
}
}
return RaptorParisLover;
});
</script>
Preparation code output
Test runner
Warning! For accurate results, please disable Firebug before running the tests. (Why?)
Java applet disabled.
Test | Ops/sec | |
---|---|---|
JSFace
|
|
pending… |
my.Class
|
|
pending… |
John Resig Class
|
|
pending… |
Klass
|
|
pending… |
Classy
|
|
pending… |
PTClass
|
|
pending… |
CoffeeScript Classes
|
|
pending… |
augment
|
|
pending… |
Ext JS
|
|
pending… |
Ovy
|
|
pending… |
dejavu
|
|
pending… |
dejavu optimized
|
|
pending… |
dejavu optimized closures
|
|
pending… |
P
|
|
pending… |
Classifyjs
|
|
pending… |
Temoin
|
|
pending… |
Ring.js
|
|
pending… |
RaptorJS
|
|
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.
- Revision 3: published Tan Nhu
- Revision 4: published
- Revision 5: published Tan Nhu
- Revision 6: published Tan Nhu
- Revision 7: published Tan Nhu
- Revision 8: published Tan Nhu
- Revision 9: published Tan Nhu
- Revision 10: published Tan Nhu
- Revision 11: published André Cruz
- Revision 13: published André Cruz
- Revision 14: published
- Revision 15: published Tan Nhu
- Revision 16: published
- Revision 17: published
- Revision 18: published
- Revision 19: published
- Revision 21: published
- Revision 22: published
- Revision 25: published
- Revision 27: published
- Revision 28: published
- Revision 29: published
- Revision 38: published
- Revision 39: published
- Revision 40: published
- Revision 41: published
- Revision 51: published André Cruz
- Revision 52: published André Cruz
- Revision 54: published André Cruz
- Revision 58: published André Cruz
- Revision 61: published Nodir Turakulov
- Revision 62: published Airy
- Revision 64: published
- Revision 69: published
- Revision 70: published André Cruz
- Revision 77: published André Cruz
- Revision 79: published André Cruz
- Revision 83: published
- Revision 84: published Aadit M Shah
- Revision 85: published Aadit M Shah
- Revision 86: published Yuan Tao
- Revision 88: published
- Revision 89: published Aadit M Shah
- Revision 90: published Yuan Tao
- Revision 91: published Aadit M Shah
- Revision 92: published Yuan Tao
- Revision 93: published Yuan Tao
- Revision 94: published Aadit M Shah
- Revision 95: published Aadit M Shah
- Revision 96: published Yuan Tao
- Revision 97: published Aadit M Shah
- Revision 98: published Yuan Tao
- Revision 100: published Yuan Tao
- Revision 104: published
- Revision 105: published Aadit M Shah
- Revision 106: published Yuan Tao
- Revision 107: published André Cruz
- Revision 108: published Aadit M Shah
- Revision 109: published Mark Johnson
- Revision 110: published Mark Johnson
- Revision 111: published Mark Johnson
- Revision 112: published
- Revision 113: published
- Revision 117: published Aadit M Shah
- Revision 118: published Aadit M Shah
- Revision 119: published Yannick Albert and last updated
- Revision 122: published
- Revision 124: published
- Revision 127: published Aadit M Shah
- Revision 128: published and last updated
- Revision 129: published Yuan Tao
- Revision 132: published
- Revision 135: published
- Revision 136: published and last updated
- Revision 137: published
- Revision 140: published
- Revision 143: published
- Revision 144: published Patrick Steele-Idem
- Revision 145: published torworx
- Revision 146: published Yuan Tao
- Revision 147: published
- Revision 148: published
- Revision 149: published
- Revision 150: published
- Revision 151: published
- Revision 152: published
- Revision 155: published
- Revision 156: published Martijn van Beek
- Revision 157: published Austin Appleby
- Revision 158: published Aadit M Shah
- Revision 159: published Jarid Margolin
- Revision 160: published Pete Hodgson
- Revision 162: published John Doe
- Revision 163: published
- Revision 164: published
- Revision 165: published
- Revision 166: published Nicolas Vanhoren
- Revision 167: published
- Revision 168: published Kamil
- Revision 169: published Enzo
- Revision 170: published
- Revision 171: published Tom Villeneuve-Pelletier
- Revision 172: published alban
- Revision 173: published alban
- Revision 174: published alban
- Revision 175: published Naja Melan
- Revision 179: published Pedro Gomes
- Revision 181: published
- Revision 182: published
- Revision 183: published
- Revision 184: published
- Revision 185: published
- Revision 186: published thomas
0 Comments