Benchmark: Class comp - MeasureThat.net

Script Preparation code:

/**
 *
 * <p>This script provides inheritance support and is inspired by base2 and Prototype</p>
 *
 * <p>The constructor is named <pre>init()</pre></p>
 *
 * <p>If a needs to override a method of a superclass, the overridden method can always be
 * called using</p>
 * <pre>this._super();</pre>
 *
 * <p>This is true for the constructor as well as for any other method.</p>
 *
 * @see http://etobi.de/blog/artikel/weiterlesen/vererbung-mit-javascript/
 *
 * @module util/Class
 */

/**
 * Base class which allows simple inheritance.
 *
 * @class module:util/Class~Class
 * @example
 * var MyClass = Class.extends({
 *     init : function(){
 *         // do some construction
 *     }
 * })
 *
 * // you can call the super class's method from within any method like this
 * ...
 *     myMethod : function(){
 *         // call 'myMethod' of super class
 *         this._super();
 *     }
 */
// Hack, because vars cannot be imported in DW, only functions
/**
 * @class
 */
function Class() {}

// eslint-disable-next-line wrap-iife
(function () {
    var initializing = false;
    var fnTest = /xyz/.test(function () {}) ? /\b_super\b/ : /.*/;

    // The base Class implementation (does nothing)
    // this.Class = function(){};

    /**
     * Create a new sub class
     * @param  {Object} prop An object defining the members of the sub class
     * @return {Object}      The sub class
     * @instance
     */
    Class.extends = function (prop) {
        var _super = this.prototype;

        // Instantiate a base class (but only create the instance,
        // don't run the init constructor)
        initializing = true;
        var prototype = new this();
        initializing = false;

        // Copy the properties over onto the new prototype
        var callback = function (name, fn) {
            return function () {
                var tmp = this._super;

                // Add a new ._super() method that is the same method
                // but on the super-class
                this._super = _super[name];

                // The method only need to be bound temporarily, so we
                // remove it when we're done executing
                var ret = fn.apply(this, arguments);
                this._super = tmp;

                return ret;
            };
        };
        // eslint-disable-next-line guard-for-in, no-restricted-syntax
        for (var name in prop) {
            // Check if we're overwriting an existing function
            prototype[name] =
                typeof prop[name] === 'function' && typeof _super[name] === 'function' && fnTest.test(prop[name]) ? callback(name, prop[name]) : prop[name];
        }

        /**
         * The dummy class constructor
         * @constructor
         */
        function Class() { // eslint-disable-line no-shadow
            // All construction is actually done in the init method
            if (!initializing && this.init) {
                this.init.apply(this, arguments);
            }
        }

        // Populate our constructed prototype object
        Class.prototype = prototype;

        // Enforce the constructor to be what we expect
        Class.constructor = Class;

        // And make this class extendable
        // eslint-disable-next-line no-caller
        Class.extends = arguments.callee;

        return Class;
    };
})();

Tests:

Class.extends
/** @type {module:util/Class~Class} */ //module.exports = Class; const cls = Class.extends({ /** * @constructor * @param {*} resource resource * @param {string } type type of resource, can be value|fabric (value is default) */ init: function () { }, doTest: function () { } }); const cls2 = cls.extends({ doTest: function () { } }); var obj = new cls2(); obj.doTest();
cls.prototype
function cls() { } cls.prototype = {}; cls.prototype.constructor = cls; cls.prototype.doTest= function() { } function cls2 () { cls.call(this); } cls2.prototype = Object.create(cls.prototype); cls2.prototype.constructor = cls; cls2.prototype.doTest= function() { } var obj = new cls(); obj.doTest();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Class.extends
cls.prototype

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/16.3 Safari/605.1.15

Browser/OS: Safari 16 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Class.extends	2335751.8 Ops/sec
cls.prototype	1556552.2 Ops/sec

Autogenerated LLM Summary (model llama3.2:3b, generated 2 months ago):

LLMs can make mistakes. Check important info.

**Overview of the Benchmark**

The benchmark measures the performance of two different approaches to implement inheritance in JavaScript: `Class.extends` (from the `util/Class` module) and a manual implementation using prototype chaining.

**What is tested?**

* Two test cases:
	+ "Class.extends": This test case creates a new class using the `Class.extends` method, with two methods (`init` and `doTest`) defined on the class. The test then creates an instance of this class and calls its `doTest` method.
	+ "cls.prototype": This test case creates a simple class without inheritance support (using only prototype chaining) and defines two methods (`init` and `doTest`) on it. The test then creates an instance of this class and calls its `doTest` method.

**Options compared**

* Two approaches to implement inheritance in JavaScript:
	+ Manual implementation using prototype chaining (`cls.prototype`)
	+ Using the `Class.extends` method from the `util/Class` module

**Pros and Cons**

**Manual implementation (cls.prototype)**

Pros:

* Simple and straightforward
* No external dependencies required
* Allows for fine-grained control over inheritance behavior

Cons:

* Can be more verbose and error-prone due to the need to manually set up prototype chaining

**Using Class.extends (util/Class module)**

Pros:

* More concise and readable code
* Provides a simple and well-tested abstraction for implementing inheritance
* Reduces the likelihood of errors related to prototype chain management

Cons:

* External dependency on the `util/Class` module is required
* May not provide fine-grained control over inheritance behavior

**Latest benchmark results**

The latest benchmark results show that:

* The manual implementation using prototype chaining (`cls.prototype`) performs slightly better than the `Class.extends` approach.
* Both approaches are relatively fast, with average execution times of around 150-200 ms per test.

However, it's essential to note that these results may vary depending on specific use cases and JavaScript engines used.

Related benchmarks:

Class comp (version: 0)

Comparing performance of: Class.extends vs cls.prototype

Created: 3 years ago by: Guest

Jump to the latest result

Class.extends

cls.prototype

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model llama3.2:3b, generated 2 months ago):