JavaScript Object Oriented Libraries Benchmark

JavaScript performance comparison

Revision 14 of this test case created by

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/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/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/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/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/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/lib/ptclass.js"</script>
      
<script>
Benchmark.prototype.setup = function() {
  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 p1 = new JSFacePerson("John");
  var p2 = new JSFaceFrenchGuy("Leo");
  var p3 = new JSFaceParisLover("Mary");
  
  ///////////////
  
  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 p4 = new MyPerson("John");
  var p5 = new MyFrenchGuy("Leo");
  var p6 = new MyParisLover("Mary");
  
  //////////
  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 p7 = new JRPerson("John");
  var p8 = new JRFrenchGuy("Leo");
  var p9 = new JRParisLover("Mary");
  
  //////////
  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);
    }
  });
  
  var p10 = new EnderPerson("John");
  var p11 = new EnderFrenchGuy("Leo");
  var p12 = new EnderParisLover("Mary");
  
  ///////////
  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);
    }
  });
  
  var p13 = new ClassyPerson("John");
  var p14 = new ClassyFrenchGuy("Leo");
  var p15 = new ClassyParisLover("Mary");
  
  ///////////////
  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);
    }
  });
  
  var p16 = new PTClassPerson("John");
  var p17 = new PTClassFrenchGuy("Leo");
  var p18 = new PTClassParisLover("Mary");

};
</script>

Preparation code output

<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/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/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/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/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/lib/ptclass.js"</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
p3.setAddress("CH");
pending…
my.Class
p6.setAddress("CH");
pending…
John Resig Class
p9.setAddress("CH");
pending…
Klass
p12.setAddress("CH");
pending…
Classy
p15.setAddress("CH");
pending…
PTClass
p18.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