Benchmark: ES6 property get & getter function & direct access to object attribute

Script Preparation code:

class Class {
    constructor () {
        this._val = 1
    }
    get value() { return this._val }
    set value(x) { this._val = x }
    getValue() { return this._val }
    setValue(x) { this.val = x }
}
var cls = new Class()
var wtf

Tests:

ES6 property (get)
wtf = cls.value
Getter function
wtf = cls.getValue()
Directly get
wtf = cls._val

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
ES6 property (get)
Getter function
Directly get

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 134 on Windows

View result in a separate tab

Test name	Executions per second
ES6 property (get)	15070737.0 Ops/sec
Getter function	15178410.0 Ops/sec
Directly get	15033348.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided JSON benchmark definition and test cases.

**Benchmark Definition**

The benchmark definition is a JSON object that represents a JavaScript microbenchmark. It contains the following properties:

* `Name`: A unique name for the benchmark, which is "ES6 property get & getter function & direct access to object attribute".
* `Description`: An empty string, indicating that there's no description provided.
* `Script Preparation Code`: The code used to prepare the script before running the benchmark. In this case, it defines a class with getter and setter functions for an attribute `_val`.
* `Html Preparation Code`: An empty string, indicating that no HTML preparation is required.

**Individual Test Cases**

The benchmark consists of three test cases, each defined in an object within an array:

1. **Test Case 1: ES6 property (get)**
	* `Benchmark Definition`: "wtf = cls.value"
	* `Test Name`: "ES6 property (get)"
2. **Test Case 2: Getter function**
	* `Benchmark Definition`: "wtf = cls.getValue()"
	* `Test Name`: "Getter function"
3. **Test Case 3: Directly get**
	* `Benchmark Definition`: "wtf = cls._val"
	* `Test Name`: "Directly get"

**Options Compared**

These three test cases compare the performance of accessing an object attribute using three different methods:

1. **ES6 property (get)**: Using the `cls.value` syntax, which is a getter function that returns the value of the `_val` attribute.
2. **Getter function**: Using the `cls.getValue()` syntax, which explicitly calls a getter function to retrieve the value.
3. **Directly get**: Accessing the `_val` attribute directly using `cls._val`.

**Pros and Cons**

Here's a brief analysis of each approach:

* **ES6 property (get)**: Pros:
	+ More readable and concise syntax
	+ Less prone to errors due to explicit getter function calls
*   Cons:
    * May incur additional overhead due to getter function invocation
*   **Getter function**: Pros:
    * Explicit control over attribute access, which can help with debugging
    * Can be used for more complex logic or transformations
*   Cons:
    * More verbose syntax compared to ES6 property (get)
    * May introduce additional overhead due to function call overhead
*   **Directly get**: Pros:
    * Fastest and most efficient way to access an attribute
    * No additional overhead due to getter function invocation
*   Cons:
    * Less readable and more error-prone syntax
    * May lead to accidental or intentional attribute modification

**Library Usage**

The benchmark uses the `Class` constructor from JavaScript, which is a part of the ECMAScript standard. The purpose of this class is to demonstrate object-oriented programming concepts in JavaScript.

**Special JS Features/Syntax**

This benchmark does not explicitly use any special JavaScript features or syntax, such as async/await, promises, or newer language features like `const` and `let` (which are used in the script preparation code).

**Alternatives**

Other alternatives for accessing an object attribute could include:

* Using a getter function with the `Object.getPrototypeOf()` method to dynamically access attributes
* Utilizing property descriptor objects to customize attribute access
* Leveraging libraries like Lodash or Underscore.js, which provide utility functions for working with objects and attributes

These alternatives may offer different performance profiles, readability characteristics, or even additional features depending on the use case.

Related benchmarks:

ES6 property get & getter function & direct access to object attribute (version: 0)

Comparing performance of: ES6 property (get) vs Getter function vs Directly get

Created: 4 years ago by: Guest

Jump to the latest result

ES6 property (get)

Getter function

Directly get

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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