Backbone Vs John Resig Vs Spine's Simple JavaScript Inheritance

JavaScript performance comparison

Revision 9 of this test case created by Nathan Palmer

Preparation code

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js">
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/spinejs/0.0.4/spine.min.js"></script>
<script>
  /* Simple JavaScript Inheritance
 * By John Resig http://ejohn.org/
 * MIT Licensed.
 */
  // Inspired by base2 and Prototype
  (function() {
    var a = false,
        b = /xyz/.test(function() {
        xyz
      }) ? /\b_super\b/ : /.*/;
    this.Class = function() {};
    Class.extend = function(g) {
      var f = this.prototype;
      a = true;
      var e = new this();
      a = false;
      for (var d in g) {
        e[d] = typeof g[d] == "function" && typeof f[d] == "function" && b.test(g[d]) ? (function(h, i) {
          return function() {
            var k = this._super;
            this._super = f[h];
            var j = i.apply(this, arguments);
            this._super = k;
            return j
          }
        })(d, g[d]) : g[d]
      }

      function c() {
        if (!a && this.init) {
          this.init.apply(this, arguments)
        }
      }
      c.prototype = e;
      c.prototype.constructor = c;
      c.extend = arguments.callee;
      return c
    }
  })();
</script>
      
<script>
Benchmark.prototype.setup = function() {
  window.array = [];
  
  myModel = Backbone.Model.extend({
    afun: function() {}
  });
  
  ResigsClass = Class.extend({
    afun: function() {}
  });
  
  SpineClass = window.Spine.Class.sub({
    afun: function() {}
  });

};
</script>

Preparation code output

<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"> </script> <script src="https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.0.0/backbone-min.js"> </script> <script src="https://cdnjs.cloudflare.com/ajax/libs/spinejs/0.0.4/spine.min.js"></script> <script> /* Simple JavaScript Inheritance * By John Resig http://ejohn.org/ * MIT Licensed. */ // Inspired by base2 and Prototype (function() { var a = false, b = /xyz/.test(function() { xyz }) ? /\b_super\b/ : /.*/; this.Class = function() {}; Class.extend = function(g) { var f = this.prototype; a = true; var e = new this(); a = false; for (var d in g) { e[d] = typeof g[d] == "function" && typeof f[d] == "function" && b.test(g[d]) ? (function(h, i) { return function() { var k = this._super; this._super = f[h]; var j = i.apply(this, arguments); this._super = k; return j } })(d, g[d]) : g[d] } function c() { if (!a && this.init) { this.init.apply(this, arguments) } } c.prototype = e; c.prototype.constructor = c; c.extend = arguments.callee; return c } })(); </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
Create new instance of Backbone.Model
array.push(new myModel());
pending…
Create Backbone.Model objects
array.push(Backbone.Model.extend({
  afun: function() {}
}));
pending…
John Resig Approach
array.push(new ResigsClass());
pending…
Spine Class
array.push(SpineClass.create());
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