JavaScript Object Oriented Libraries Benchmark

JavaScript performance comparison

Revision 170 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/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>
(function (global, factory) {
    if (typeof define === "function" && define.amd) define(factory);
    else if (typeof module === "object") module.exports = factory();
    else global.augment = factory();
}(this, function () {

    "use strict";

    var Factory = function () {};
    var slice = Array.prototype.slice;

    return function (base, body) {
        var uber = Factory.prototype = typeof base === "function" ? base.prototype : base;
        var prototype = new Factory;
        body.apply(prototype, slice.call(arguments, 2).concat(uber));
        if (!prototype.hasOwnProperty("constructor")) return prototype;
        var constructor = prototype.constructor;
        constructor.prototype = prototype;
        return constructor;
    }
}));
</script>
<script src="http://cdn.sencha.com/ext-4.1.1a-gpl/builds/ext-foundation.js">
</script>
<script src="https://raw.github.com/torworx/ovy/master/ovy.js">
</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 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 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 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 ClosurePerson = (function() {



    return     (function(){
      function ClosurePerson(name) {
        var $private=1
        this.name=name
        ClosurePerson.prototype.getName=function(){
          return $private;
        }
      }

      ClosurePerson.prototype.setAddress = function(country, city, street) {
        this.country = country;
        this.city = city;
        this.street = street;
      }
      return ClosurePerson
    })();
  })();

  var ClosureFrenchGuy = (function(_super) {

    __extends(ClosureFrenchGuy, _super);

    function ClosureFrenchGuy(name) {
      ClosureFrenchGuy.__super__.constructor.call(this, name);
    }

    ClosureFrenchGuy.prototype.setAddress = function(city, street) {
      return ClosureFrenchGuy.__super__.setAddress.call(this, "France", city, street);
    };

    return ClosureFrenchGuy;

  })(ClosurePerson);

  var ClosureParisLover = (function(_super) {

    __extends(ClosureParisLover, _super);

    function ClosureParisLover(name) {
      ClosureParisLover.__super__.constructor.call(this, name);
    }

    ClosureParisLover.prototype.setAddress = function(street) {
      return ClosureParisLover.__super__.setAddress.call(this, "Paris", street);
    };

    return ClosureParisLover;

  })(ClosureFrenchGuy);



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

  var NativeFrenchGuy = function(name) {
    NativePerson.call(this, name);
  };
  NativeFrenchGuy.prototype = Object.create(NativePerson.prototype);
  NativeFrenchGuy.prototype.constructor = NativeFrenchGuy;
  NativeFrenchGuy.prototype.setAddress = function(city, street) {
    NativePerson.prototype.setAddress.call(this, 'France', city, street);
  };

  var NativeParisLover = function(name) {
    NativeFrenchGuy.call(this, name);
  };
  NativeParisLover.prototype = Object.create(NativeFrenchGuy.prototype);
  NativeParisLover.prototype.constructor = NativeParisLover;
  NativeParisLover.prototype.setAddress = function(street) {
    NativeFrenchGuy.prototype.setAddress.call(this, 'Paris', street);
  };


var createPerson = function(name){
  var address = {};    
    
  var getName = function(){ return name; }
  var getAddress = function(){ return address; }
  var setAddress = function(country,city,street){
      address = {
          country:country,
          city:city,
          street:street
      };
  }
  return {
      getName:getName,
      getAddress:getAddress,
      setAddress:setAddress
  };
};

var createFrenchPerson = function(name){
    var person = createPerson(name);
      
    var setAddress = function(city,street){
      person.setAddress('france',city,street);
    }
      
    return {
      getName: person.getName,
      getAddress: person.getAddress,
      setAddress: setAddress
    };
};

var createParisPerson = function(name){
    var frenchPerson = createFrenchPerson(name);
      
    var setAddress = function(street){
      frenchPerson.setAddress('paris',street);
    }
      
    return {
      getName: frenchPerson.getName,
      getAddress: frenchPerson.getAddress,
      setAddress: setAddress
    };
};

</script>
    

Preparation code output

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…
ClosureClasses
var p21 = new ClosureParisLover("Mary");
p21.setAddress("CH");
pending…
Native
var p42 = new NativeParisLover("Mary");
p42.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