JavaScript Object Oriented Libraries Benchmark

JavaScript performance comparison

Revision 173 of this test case created by alban

Preparation code

<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>
(function () {
this.xClass = function () {};
xClass.extend = function extend(prop) {
    var name, prototype 		= new this();
	prototype.parent 	= this.prototype;
	
    for (name in prop) {
		if(typeof prop[name] == 'function') {
			prototype[name] = (function(fun){
				return function() { return fun.apply(this, arguments) }
			})(prop[name]);
		} else {
			prototype[name] = prop[name];
		}
    }
    
	
    function xClass(init) {
		this.construct.apply(this, arguments);
    }
    xClass.prototype = prototype;
    xClass.prototype.constructor = xClass;
    xClass.extend = extend;
    return xClass;
};
}) ();
</script>


<script>

  this.yClass = function () {};
  yClass.extend = function extend(prop) {
  var prototype 		= new this();
	prototype.parent 	= this.prototype;
	
    for (var name in prop) {
      if(prop.hasOwnProperty(name) ) {
        prototype[name] = prop[name];
      }
    }
    
	
    function yClass() {
		this.init.apply(this, arguments);
    }
    yClass.prototype = prototype;
    yClass.prototype.constructor = yClass;
    yClass.extend = extend;
    return yClass;
  };

</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);
    }
  });

  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);
    }
  });

  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);
    }
  });


  var xPerson = xClass.extend({
    construct: 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 xFrenchGuy = xPerson.extend({
    construct: function(name) {
      this.parent.construct(name);
    },
    setAddress: function(city, street) {
      this.parent.setAddress('France', city, street);
    }
  });

  var xParisLover = xFrenchGuy.extend({
    construct: function(name) {
      this.parent.construct(name);
    },
    setAddress: function(street) {
       
      this.parent.setAddress('Paris', street);
    }
  });


var yPerson = yClass.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 yFrenchGuy = yPerson.extend({
  init: function (name) {
    this.parent.init.call(this.parent, name);
  },
  setAddress: function (city, street) {
    this.parent.setAddress.call(this.parent,'France', city, street);
  }
});



var yParisLover = yFrenchGuy.extend({
  init: function (name) {
    this.parent.init.call(this.parent, name);
  },
  setAddress: function (street) {
    this.parent.setAddress.call(this.parent,'Paris', street);
  }
});


</script>
    

Preparation code output

<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> (function () { this.xClass = function () {}; xClass.extend = function extend(prop) { var name, prototype = new this(); prototype.parent = this.prototype; for (name in prop) { if(typeof prop[name] == 'function') { prototype[name] = (function(fun){ return function() { return fun.apply(this, arguments) } })(prop[name]); } else { prototype[name] = prop[name]; } } function xClass(init) { this.construct.apply(this, arguments); } xClass.prototype = prototype; xClass.prototype.constructor = xClass; xClass.extend = extend; return xClass; }; }) (); </script> <script> this.yClass = function () {}; yClass.extend = function extend(prop) { var prototype = new this(); prototype.parent = this.prototype; for (var name in prop) { if(prop.hasOwnProperty(name) ) { prototype[name] = prop[name]; } } function yClass() { this.init.apply(this, arguments); } yClass.prototype = prototype; yClass.prototype.constructor = yClass; yClass.extend = extend; return yClass; }; </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); } }); 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); } }); 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); } }); var xPerson = xClass.extend({ construct: 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 xFrenchGuy = xPerson.extend({ construct: function(name) { this.parent.construct(name); }, setAddress: function(city, street) { this.parent.setAddress('France', city, street); } }); var xParisLover = xFrenchGuy.extend({ construct: function(name) { this.parent.construct(name); }, setAddress: function(street) { this.parent.setAddress('Paris', street); } }); var yPerson = yClass.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 yFrenchGuy = yPerson.extend({ init: function (name) { this.parent.init.call(this.parent, name); }, setAddress: function (city, street) { this.parent.setAddress.call(this.parent,'France', city, street); } }); var yParisLover = yFrenchGuy.extend({ init: function (name) { this.parent.init.call(this.parent, name); }, setAddress: function (street) { this.parent.setAddress.call(this.parent,'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
yClass
var p10 = new yParisLover("Mary");
p10.setAddress("CH");
pending…
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…
xClass
var p9 = new xParisLover("Mary");
p9.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