Multiple Class Systems

JavaScript performance comparison

Revision 8 of this test case created by

Preparation code

<script src="https://rawgithub.com/jashkenas/underscore/1.5.2/underscore.js" type="text/javascript"></script>
<script src="https://rawgithub.com/nicolas-van/ring.js/1.0.0/ring.js" type="text/javascript"></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://cdn.sencha.com/ext-4.1.1a-gpl/builds/ext-foundation.js">
</script>
<script src="http://indigounited.com/dejavu/dejavu.js">
</script>
<script src="https://rawgithub.com/weikinhuang/Classify/v0.13.0/dist/classify.js"></script>
<script src="https://rawgithub.com/fnando/module/master/module.js"></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;
    }
  });
</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 + '.');
    }
  });
</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;
    }
  });
</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;
    }
  });
</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;
    }
  });
</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;
    }
  });
</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;
    }
  });
</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;
    }
  });
</script>
<script>
Module("ModulePerson", function(ModulePerson){
    ModulePerson.fn.initialize = function(name) {
        this.name = name;
    };
    ModulePerson.fn.setAddress = function(country,city,street){
      this.country = country;
      this.city = city;
      this.street = street;
    };
});
</script>
    

Preparation code output

<script src="https://rawgithub.com/nicolas-van/ring.js/1.0.0/ring.js" type="text/javascript"></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://cdn.sencha.com/ext-4.1.1a-gpl/builds/ext-foundation.js"> </script> <script src="http://indigounited.com/dejavu/dejavu.js"> </script> <script src="https://rawgithub.com/weikinhuang/Classify/v0.13.0/dist/classify.js"></script> <script src="https://rawgithub.com/fnando/module/master/module.js"></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; } }); </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 + '.'); } }); </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; } }); </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; } }); </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; } }); </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; } }); </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; } }); </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; } }); </script> <script> Module("ModulePerson", function(ModulePerson){ ModulePerson.fn.initialize = function(name) { this.name = name; }; ModulePerson.fn.setAddress = function(country,city,street){ this.country = country; this.city = city; this.street = 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
Ring.js
var p69 = new RingPerson("Mary");
p69.setAddress("France", "Paris", "CH");
p69.setAddress("France", "Paris", "CH");
p69.setAddress("France", "Paris", "CH");
p69.setAddress("France", "Paris", "CH");
p69.setAddress("France", "Paris", "CH");
p69.setAddress("France", "Paris", "CH");
pending…
John Resig's
var p9 = new JRPerson("Mary");
p9.setAddress("France", "Paris", "CH");
p9.setAddress("France", "Paris", "CH");
p9.setAddress("France", "Paris", "CH");
p9.setAddress("France", "Paris", "CH");
p9.setAddress("France", "Paris", "CH");
p9.setAddress("France", "Paris", "CH");
pending…
Klass
var p12 = new EnderPerson("Mary");
p12.setAddress("France", "Paris", "CH");
p12.setAddress("France", "Paris", "CH");
p12.setAddress("France", "Paris", "CH");
p12.setAddress("France", "Paris", "CH");
p12.setAddress("France", "Paris", "CH");
p12.setAddress("France", "Paris", "CH");
pending…
Classy
var p15 = new ClassyPerson("Mary");
p15.setAddress("France", "Paris", "CH");
p15.setAddress("France", "Paris", "CH");
p15.setAddress("France", "Paris", "CH");
p15.setAddress("France", "Paris", "CH");
p15.setAddress("France", "Paris", "CH");
p15.setAddress("France", "Paris", "CH");
pending…
PTClass
var p18 = new PTClassPerson("Mary");
p18.setAddress("France", "Paris", "CH");
p18.setAddress("France", "Paris", "CH");
p18.setAddress("France", "Paris", "CH");
p18.setAddress("France", "Paris", "CH");
p18.setAddress("France", "Paris", "CH");
p18.setAddress("France", "Paris", "CH");
pending…
Ext
var p27 = new ExtPerson("Mary");
p27.setAddress("France", "Paris", "CH");
p27.setAddress("France", "Paris", "CH");
p27.setAddress("France", "Paris", "CH");
p27.setAddress("France", "Paris", "CH");
p27.setAddress("France", "Paris", "CH");
p27.setAddress("France", "Paris", "CH");
pending…
dejavu
var p33 = new dejavuClassPerson("Mary");
p33.setAddress("France", "Paris", "CH");
p33.setAddress("France", "Paris", "CH");
p33.setAddress("France", "Paris", "CH");
p33.setAddress("France", "Paris", "CH");
p33.setAddress("France", "Paris", "CH");
p33.setAddress("France", "Paris", "CH");
pending…
Classifyjs
var p52 = new ClassifyPerson("Mary");
p52.setAddress("France", "Paris", "CH");
p52.setAddress("France", "Paris", "CH");
p52.setAddress("France", "Paris", "CH");
p52.setAddress("France", "Paris", "CH");
p52.setAddress("France", "Paris", "CH");
p52.setAddress("France", "Paris", "CH");
pending…
Modulejs
var p99 = ModulePerson("Mary");
p99.setAddress("France", "Paris", "CH");
p99.setAddress("France", "Paris", "CH");
p99.setAddress("France", "Paris", "CH");
p99.setAddress("France", "Paris", "CH");
p99.setAddress("France", "Paris", "CH");
p99.setAddress("France", "Paris", "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