Benchmark: class getter/setter vs property

Script Preparation code:

class TestAccessor {
  _val = 0
  get val() {
    return this._val
  }
  set val(val) {
    this._val = val
  }
}
var testAccessor = new TestAccessor()

class TestProp {
  val = 0
}
var testProp = new TestProp()

Tests:

accessor
testAccessor.val += 1
prop
testProp.val += 1

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
accessor
prop

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/145.0.0.0 Safari/537.36

Browser/OS: Chrome 145 on Windows

View result in a separate tab

Test name	Executions per second
accessor	111544744.0 Ops/sec
prop	124834272.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Measuring JavaScript performance is a complex task, and MeasurThat.net provides a great platform for benchmarking various aspects of the language.

**Benchmark Definition**

The provided JSON represents a simple benchmark that tests two different approaches to accessing and modifying a value: using getter/setter methods (`class TestAccessor`) versus using a property access (`class TestProp`).

In essence, the benchmark measures the performance difference between these two approaches when incrementing the value associated with `val`.

**Options Compared**

There are two options being compared:

1. **Class Getter/Setter Method**: This approach uses a class with getter and setter methods to access and modify the value. The getter method returns the current value, and the setter method updates the value.
2. **Property Access**: This approach uses a simple property `val` to access and modify the value.

**Pros and Cons**

Here are some pros and cons of each approach:

**Class Getter/Setter Method**

Pros:

* Can provide more control over access and modification of the value
* May be useful for scenarios where you need to perform additional operations before or after updating the value

Cons:

* Generally slower than property access due to the overhead of method calls
* May have additional memory overhead compared to a simple property

**Property Access**

Pros:

* Faster and more efficient than getter/setter methods
* Less memory overhead compared to getter/setter methods

Cons:

* Less control over access and modification of the value
* May not provide additional benefits in scenarios where you need to perform complex operations

**Library Usage (None)**

There is no library being used in this benchmark.

**Special JS Features/ Syntax**

This benchmark does not use any special JavaScript features or syntax. It's a simple, straightforward test that can be run on most browsers.

**Alternatives**

If you wanted to create similar benchmarks for other scenarios, here are some alternative approaches:

* Using `let` and `const` declarations instead of classes
* Comparing the performance of different data structures (e.g., arrays vs. objects)
* Testing the impact of specific browser features or extensions on performance

Keep in mind that when creating new benchmarks, it's essential to consider factors like code readability, maintainability, and repeatability to ensure accurate results.

Related benchmarks:

class getter/setter vs property (version: 0)

Comparing performance of: accessor vs prop

Created: 2 years ago by: Guest

Jump to the latest result

accessor

prop

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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