JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdn.rawgit.com/bestiejs/benchmark.js/v1.0.0/benchmark.js"></script>
<script src="https://cdn.rawgit.com/dtcyganok/subtype/master/subtype.js"></script>
<pre id="output"></pre>
JavaScript
/* jshint eqnull: true */
var outputElement = document.getElementById('output');
var inheritanceSuite = new Benchmark.Suite();
var creationSuite = new Benchmark.Suite();
function log(string) {
outputElement.appendChild(
document.createTextNode((string == null ? '' : string) + '\n')
);
}
inheritanceSuite.add('subtype inheritance', function () {
var First = Subtype.extend({
constructor: function (value) {
this.value = value;
},
methodA: function () {},
methodB: function () {}
});
var Second = First.extend({
constructor: function (value) {
First.call(this, value);
},
methodA: function () {
First.prototype.methodA.call(this);
},
methodB: function () {
First.prototype.methodB.call(this);
}
});
var Third = Second.extend({
constructor: function (value) {
Second.call(this, value);
},
methodA: function () {
Second.prototype.methodA.call(this);
},
methodB: function () {
Second.prototype.methodB.call(this);
}
});
});
creationSuite.add('subtype creation', (function () {
var First = Subtype.extend({
constructor: function (value) {
this.value = value;
},
methodA: function () {},
methodB: function () {}
});
var Second = First.extend({
constructor: function (value) {
First.call(this, value);
},
methodA: function () {
First.prototype.methodA.call(this);
},
methodB: function () {
First.prototype.methodB.call(this);
}
});
var Third = Second.extend({
constructor: function (value) {
Second.call(this, value);
},
methodA: function () {
Second.prototype.methodA.call(this);
},
methodB: function () {
Second.prototype.methodB.call(this);
}
});
return function () {
new First('value');
new Second('value');
new Third('value');
};
})());
inheritanceSuite.add('native inheritance', function () {
var First = function (value) {
...