Benchmark: JS: Getter/Setter vs Direct Access Performance

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

const existingA = 'truthy-value';
const existingB = undefined;
class Env {
   get a() {
      return existingA || 'a-default-value';
   }
   get b() {
      return existingB || 'b-default-value';
   }
}
const env = new Env();
const config = {
   c: 'c-value',
};

Tests:

access existing value
function a() { return env.a; } const aReading = a();
access default value
function b() { return env.b; } const bReading = b();
access static value
function c() { return config.c; } const cReading = c();

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
access existing value
access default value
access static value

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/133.0.0.0 Safari/537.36

Browser/OS: Chrome 133 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
access existing value	278953312.0 Ops/sec
access default value	136031408.0 Ops/sec
access static value	279294240.0 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):

LLMs can make mistakes. Check important info.

The benchmark defined in the provided JSON focuses on comparing the performance of different methods of accessing properties in JavaScript, specifically contrasting the efficiency of getter functions versus direct property access. Here’s a breakdown of what is being tested, the various approaches involved, their pros and cons, and alternative methods.

### Benchmark Overview

#### Options Compared
1. **Using a Getter**:
   - **Test Name**: "access existing value"
   - **Benchmark Definition**: `return env.a;` (accessing the value through a getter).

2. **Using a Getter with Default**:
   - **Test Name**: "access default value"
   - **Benchmark Definition**: `return env.b;` (accessing a value that defaults from undefined).

3. **Direct Property Access**:
   - **Test Name**: "access static value"
   - **Benchmark Definition**: `return config.c;` (directly accessing a static property).

### Results Summary
- **Performance**:
  1. Accessing static value (`config.c`) yielded the highest performance with **156,261,936 executions per second**.
  2. Accessing an existing value (`env.a`) came next with **150,341,680 executions per second**.
  3. Accessing a default value (`env.b`) was the slowest at **145,871,904 executions per second**.

### Detailed Analysis of Approaches

1. **Getter Approach**:
   - **Pros**:
     - Encapsulation: Getters can include additional logic (e.g., computing values dynamically rather than just accessing stored data).
     - Flexibility: Allows for lazy loading or computed properties without changing the way properties are accessed.
   - **Cons**:
     - Overhead: There is additional function call overhead which can slow down performance. In this benchmark, the performance hit is visible in accessing `env.b`, which defaults to returning a static string.
   - **Use case**: Useful when you need to change the underlying data behind a property without changing the interface.

2. **Direct Property Access**:
   - **Pros**:
     - Simplicity: Direct access is generally faster, as there’s no function call overhead.
     - Clarity: It is straightforward, making the code easier to read.
   - **Cons**:
     - Limited functionality: You cannot add custom logic for when the property is accessed (e.g., validation, lazy initialization).
   - **Use case**: Ideal for accessing constant values or object properties where encapsulation is not needed.

### Other Considerations
- **Environment Factors**: The benchmark was run in a specific environment (Safari on macOS). Performance might vary across different browsers and devices; thus, results should be interpreted contextually.
- **Garbage Collection**: In long-running applications, inefficiencies may arise from garbage collection and memory management, particularly when using getters that create closures.
- **Read-Heavy Operations**: If many reads are involved, using direct property access may generally yield better performance.

### Alternatives
- **Object.assign() or Object.create()**: These methods can create objects with different prototypes for custom behavior but may also add performance costs due to added complexity.
- **Proxies**: The `Proxy` object can allow for dynamic property manipulation and access, replacing getter methods with more control, although it introduces more overhead.
- **Stored Methods**: Instead of getters, functions that return values could be stored directly, allowing for optimized calls similar to direct access, but maintaining the flexibility of processed values.

In conclusion, while getters provide encapsulation and flexibility, direct property access is significantly faster for straightforward property retrieval. The choice between these methods should depend on the specific needs for performance versus functionality in a given application context.

Related benchmarks:

JS: Getter/Setter vs Direct Access Performance (version: 1)

Comparing performance of: access existing value vs access default value vs access static value

Created: 2 months ago by: Guest

Jump to the latest result

access existing value

access default value

access static value

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):