JavaScript Object Oriented Libraries Benchmark

JavaScript performance comparison

Revision 69 of this test case created by

Preparation code

<script src="http://dl.dropbox.com/u/7677927/oop-benchmark/lib/jsface.js"></script>

<script src="https://raw.github.com/nodirt/defineClass/master/defineClass.js"></script>

<script src="https://raw.github.com/kriszyp/compose/master/compose.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="http://dl.dropbox.com/u/7677927/oop-benchmark/all.js"></script>

<script src="http://indigounited.com/dejavu/dejavu.js"></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,
  setAddress: function(city, street) {
    this.$super('France', city, street);
  }
});

var DejavuClassParisLover = dejavu.Class.declare({
  $extends: DejavuClassFrenchGuy,
  setAddress: function(street) {
    this.$super('Paris', street);
  }
});

var DejavuClassPerson2 = 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 DejavuClassFrenchGuy2 = DejavuClassPerson2.extend(function ($super) {
   return {
       setAddress: function(city, street) {
           $super.setAddress.call(this, 'France', city, street);
       }
   };
}, true);

var DejavuClassParisLover2 = DejavuClassFrenchGuy2.extend(function ($super) {
    return {
        setAddress: function(street) {
            $super.setAddress.call(this, 'Paris', street);
        }
    };
}, true);

var dcClassPerson = defineClass({
  constructor: function(name){
    this.name = name;
  },
  setAddress: function(country, city, street) {
    this.country = country;
    this.city = city;
    this.street = street;
  }
});

var dcClassFrenchGuy = defineClass({
  _super: dcClassPerson,
  setAddress: function(city, street) {
    this._super('France', city, street);
  }
});

var dcClassParisLover = defineClass({
  _super: dcClassFrenchGuy,
  setAddress: function(street) {
    this._super('Paris', street);
  }
});

var ComposeClassPerson = Compose(function (name){
    this.name = name;
  },{
  setAddress: function(country, city, street) {
    this.country = country;
    this.city = city;
    this.street = street;
  }
});

var ComposeClassFrenchGuy = Compose(ComposeClassPerson, {
  setAddress: function(city, street) {
    Compose.call(ComposeClassPerson, function () { setAddresss('France', city, street);})
  }
});

var ComposeParisLover = Compose(ComposeClassFrenchGuy, {
  setAddress: function(street) {
    Compose.call(ComposeClassFrenchGuy , function () { setAddresss('Paris', street);});
  }
});

// inherits copied from npm package
function inherits (c, p, proto) {
  function F () { this.constructor = c }
  F.prototype = p.prototype
  var e = {}
  for (var i in c.prototype) if (c.prototype.hasOwnProperty(i)) {
    e[i] = c.prototype[i]
  }
  if (proto) for (var i in proto) if (proto.hasOwnProperty(i)) {
    e[i] = proto[i]
  }
  c.prototype = new F()
  for (var i in e) if (e.hasOwnProperty(i)) {
    c.prototype[i] = e[i]
  }
  c.super = p
}

var VanillaPerson = function (name) {
  this.name = name;
};
VanillaPerson.prototype.setAddress = function(country, city, street) {
  this.country = country;
  this.city = city;
  this.street = street;
};

var VanillaFrenchGuy = function (name) {
  VanillaPerson.call(this, name);
};

inherits(VanillaFrenchGuy, VanillaPerson);

VanillaFrenchGuy.prototype.setAddress = function (city, street) {
  VanillaPerson.prototype.setAddress.call(this, 'France', city, street);
};


var VanillaParisLover = function (name) {
  VanillaFrenchGuy.call(this, name);
};

inherits(VanillaParisLover, VanillaFrenchGuy);

VanillaParisLover.prototype.setAddress = function (street) {
  VanillaFrenchGuy.prototype.setAddress.call(this, 'Paris', street);
};
</script>
    

Preparation code output

<script src="https://raw.github.com/nodirt/defineClass/master/defineClass.js"></script> <script src="https://raw.github.com/kriszyp/compose/master/compose.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="http://dl.dropbox.com/u/7677927/oop-benchmark/all.js"></script> <script src="http://indigounited.com/dejavu/dejavu.js"></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, setAddress: function(city, street) { this.$super('France', city, street); } }); var DejavuClassParisLover = dejavu.Class.declare({ $extends: DejavuClassFrenchGuy, setAddress: function(street) { this.$super('Paris', street); } }); var DejavuClassPerson2 = 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 DejavuClassFrenchGuy2 = DejavuClassPerson2.extend(function ($super) { return { setAddress: function(city, street) { $super.setAddress.call(this, 'France', city, street); } }; }, true); var DejavuClassParisLover2 = DejavuClassFrenchGuy2.extend(function ($super) { return { setAddress: function(street) { $super.setAddress.call(this, 'Paris', street); } }; }, true); var dcClassPerson = defineClass({ constructor: function(name){ this.name = name; }, setAddress: function(country, city, street) { this.country = country; this.city = city; this.street = street; } }); var dcClassFrenchGuy = defineClass({ _super: dcClassPerson, setAddress: function(city, street) { this._super('France', city, street); } }); var dcClassParisLover = defineClass({ _super: dcClassFrenchGuy, setAddress: function(street) { this._super('Paris', street); } }); var ComposeClassPerson = Compose(function (name){ this.name = name; },{ setAddress: function(country, city, street) { this.country = country; this.city = city; this.street = street; } }); var ComposeClassFrenchGuy = Compose(ComposeClassPerson, { setAddress: function(city, street) { Compose.call(ComposeClassPerson, function () { setAddresss('France', city, street);}) } }); var ComposeParisLover = Compose(ComposeClassFrenchGuy, { setAddress: function(street) { Compose.call(ComposeClassFrenchGuy , function () { setAddresss('Paris', street);}); } }); // inherits copied from npm package function inherits (c, p, proto) { function F () { this.constructor = c } F.prototype = p.prototype var e = {} for (var i in c.prototype) if (c.prototype.hasOwnProperty(i)) { e[i] = c.prototype[i] } if (proto) for (var i in proto) if (proto.hasOwnProperty(i)) { e[i] = proto[i] } c.prototype = new F() for (var i in e) if (e.hasOwnProperty(i)) { c.prototype[i] = e[i] } c.super = p } var VanillaPerson = function (name) { this.name = name; }; VanillaPerson.prototype.setAddress = function(country, city, street) { this.country = country; this.city = city; this.street = street; }; var VanillaFrenchGuy = function (name) { VanillaPerson.call(this, name); }; inherits(VanillaFrenchGuy, VanillaPerson); VanillaFrenchGuy.prototype.setAddress = function (city, street) { VanillaPerson.prototype.setAddress.call(this, 'France', city, street); }; var VanillaParisLover = function (name) { VanillaFrenchGuy.call(this, name); }; inherits(VanillaParisLover, VanillaFrenchGuy); VanillaParisLover.prototype.setAddress = function (street) { VanillaFrenchGuy.prototype.setAddress.call(this, 'Paris', street); }; </script>

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
JSFace
var p3 = new JSFaceParisLover("Mary");
p3.setAddress("CH");
pending…
my.Class
var p6 = new MyParisLover("Mary");
p6.setAddress("CH");
pending…
John Resig Class
var p9 = new JRParisLover("Mary");
p9.setAddress("CH");
pending…
Klass
var p12 = new EnderParisLover("Mary");
p12.setAddress("CH");
pending…
Classy
var p15 = new ClassyParisLover("Mary");
p15.setAddress("CH");
pending…
PTClass
var p18 = new PTClassParisLover("Mary");
p18.setAddress("CH");
pending…
dejavu
var p19 = new DejavuClassParisLover("Mary");
p19.setAddress("CH");
pending…
dejavu (after optimization)
var p20 = new DejavuClassParisLover2("Mary");
p20.setAddress("CH");
pending…
defineClass
var p21 = new dcClassParisLover("Mary");
p21.setAddress("CH");
pending…
Compose
var p22 = new ComposeParisLover("Mary");
p22.setAddress("CH");
pending…
vanilla
var p24 = new VanillaParisLover("Mary");
p24.setAddress("CH");
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.

0 Comments