Benchmark: this vs super in inheritance

Script Preparation code:

var Animal = class Animal {
  constructor(sound, name) {
    this.sound = sound;
    this.name = name;    
  }
  getMessage() {
    return 1337;
  }
}

var Dog = class Dog extends Animal {
  constructor() {
    super('woof', 'dog');
    this.legs = 4
  }
  
  // hard coded values
  usingThis() {
    this.getMessage();
  }
  usingSuper() {
    super.getMessage();
  }
  
  // class variables
  usingThisVariables() {
    return this.sound;
  }
  usingSuperVariable() {
  	return super.sound; 
  }
}

var animal = new Animal('meow', 'cat');
var dog = new Dog();

Tests:

usingThis
const foo = dog.usingThis();
usingSuper
const foo = dog.usingSuper();
usingThisVariables
const foo = dog.usingThisVariables();
usingSuperVariable
const foo = dog.usingSuperVariable();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
usingThis
usingSuper
usingThisVariables
usingSuperVariable

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 months ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/132.0.0.0 Safari/537.36 Edg/132.0.0.0

Browser/OS: Chrome 132 on Windows

View result in a separate tab

Test name	Executions per second
usingThis	169573648.0 Ops/sec
usingSuper	141940240.0 Ops/sec
usingThisVariables	177198720.0 Ops/sec
usingSuperVariable	162338544.0 Ops/sec

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

LLMs can make mistakes. Check important info.

**Benchmark Explanation**

The provided JSON represents a JavaScript microbenchmark test case on the MeasureThat.net website. The benchmark tests the performance of different approaches in a subclass (`Dog`) when calling methods (`usingThis`, `usingSuper`, `usingThisVariables`, and `usingSuperVariable`) that reference their parent class (`Animal`).

**Options Compared**

The test compares four options:

1. **`this.getMessage()`**: This approach uses the `this` keyword to access the `getMessage()` method of the subclass.
2. **`super.getMessage()`**: This approach uses the `super` keyword to access the `getMessage()` method of the parent class (`Animal`).
3. **`this.sound`**: This approach accesses a property (`sound`) of the subclass instance using the `this` keyword.
4. **`super.sound`**: This approach accesses a property (`sound`) of the parent class (`Animal`) using the `super` keyword.

**Pros and Cons**

*   Using `this.getMessage()`:
    *   Advantages: Easy to read and write, no need to know about the parent class's methods.
    *   Disadvantages: May be slower due to the overhead of accessing the subclass instance's properties.
*   Using `super.getMessage()`:
    *   Advantages: Accesses the parent class's method directly, can be faster due to fewer lookups.
    *   Disadvantages: Requires knowledge about the parent class's methods and may have a steeper learning curve.
*   Using `this.sound`:
    *   Advantages: Fast access to subclass instance properties, no need for function calls or method lookups.
    *   Disadvantages: May not be as readable as other approaches and requires knowledge about the property names.
*   Using `super.sound`:
    *   Advantages: Accesses the parent class's property directly, can be faster due to fewer lookups.
    *   Disadvantages: Requires knowledge about the parent class's properties.

**Library Usage**

There is no explicit library usage in this benchmark. The code uses built-in JavaScript features like classes, inheritance, and method calls.

**Special JS Features or Syntax**

The benchmark uses JavaScript classes, inheritance, and the `super` keyword to access methods of the parent class. These are standard features of modern JavaScript.

**Other Alternatives**

Other alternatives for accessing superclass properties or methods might include:

*   **Prototypal lookup**: Using the prototype chain to access properties or methods on a superclass.
*   **Method chaining**: Combining multiple method calls to achieve a single operation, which may be faster due to fewer lookups.

However, these approaches are less common and might not provide the same level of readability as using `this` or `super`.

**Benchmark Results**

The benchmark results show that the fastest approach varies depending on the test case:

*   `usingThisVariables`: The slowest approach.
*   `usingSuperVariable`: The second-slowest approach.
*   `usingSuper`: The middle-fastest approach.
*   `usingThis`: The fastest approach.

These results suggest that accessing subclass instance properties using `this` can be the fastest way to access superclass properties or methods in this specific benchmark.

Related benchmarks:

this vs super in inheritance (version: 1)

compare the speed of "super" vs "this" in the subclass

Comparing performance of: usingThis vs usingSuper vs usingThisVariables vs usingSuperVariable

Created: 6 years ago by: Registered User

Jump to the latest result

usingThis

usingSuper

usingThisVariables

usingSuperVariable

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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