Benchmark: Getter / Setter vs Proxy

Script Preparation code:

data1 = {};
handler = {
  get: (target, prop) => (target[prop]),
  set: (target, prop, value) => (target[prop] = value),
};
proxy = new  Proxy(data1, handler);
data2 = {
  get test() {
    return this._test;
  },
  set test(value) {
    return this._test = value;
  }
};

Tests:

setter getter
data2.test = Math.random(); console.log(data2.test);
proxy
proxy.test = Math.random(); console.log(proxy.test);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
setter getter
proxy

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/136.0.0.0 Safari/537.36 Edg/136.0.0.0

Browser/OS: Chrome 136 on Windows

View result in a separate tab

Test name	Executions per second
setter getter	118459.5 Ops/sec
proxy	124282.7 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 is designed to compare the performance of two approaches:

1.  Using getter and setter methods in an object (`data2`).
2.  Using a Proxy object with a handler that redefines the `get` and `set` methods (`proxy`).

**What are we testing?**

We're measuring the time it takes to execute two different code paths:

*   In `data2`, we have getter and setter methods defined for a property called `test`. This allows us to read and write values to this property without directly accessing the underlying `_test` variable. The performance of using these getter and setter methods will be measured.
*   For the Proxy object (`proxy`), we create a handler that redefines the `get` and `set` methods for the same `test` property. This allows us to control how the property is accessed and modified, providing insight into the performance implications of using Proxies.

**Options Compared:**

The benchmark compares two options:

*   **Getter/Setter**: Using getter and setter methods provides a more controlled way to access and modify properties in objects. However, this approach can introduce additional overhead due to the method calls.
*   **Proxy**: Proxies offer a more fine-grained control over property access and modification. They allow you to specify custom logic for these operations, which can be beneficial for specific use cases.

**Pros and Cons:**

**Getter/Setter Methods:**

Pros:

*   Easier to understand and maintain code
*   Provides a clear separation of concerns between data storage and data retrieval

Cons:

*   Introduces additional overhead due to method calls

**Proxy Objects:**

Pros:

*   Offers fine-grained control over property access and modification
*   Can provide better performance for specific use cases (e.g., caching, validation)

Cons:

*   Requires a deeper understanding of the Proxy API and its implications on performance

**Library Used:** None explicitly mentioned. However, Proxies rely on the JavaScript `Proxy` constructor and the `Object.prototype` methods (`get`, `set`, etc.).

**Special JS Feature/Syntax:** The use of Proxies is a built-in feature in JavaScript, introduced in ECMAScript 2015 (ES6). This allows you to create custom behavior for property access and modification.

**Benchmark Preparation Code:**

The code sets up two objects: `data2` with getter and setter methods for the `test` property, and `proxy` with a Proxy object that redefines the `get` and `set` methods for the same `test` property. It then prepares the test cases by setting the value of the `test` property in each object.

**Other Alternatives:**

If you want to explore alternative approaches or optimize this benchmark, consider the following options:

*   Use a more advanced Proxy setup, such as using `ProxyHandler` and `get`, `set` methods to define custom behavior.
*   Compare other properties access methods (e.g., bracket notation, dot notation).
*   Test with different types of data structures or objects to see how performance varies.

Feel free to ask if you'd like me to elaborate on any aspect!

Related benchmarks:

Getter / Setter vs Proxy (version: 0)

Comparing performance of: setter getter vs proxy

Created: 5 years ago by: Guest

Jump to the latest result

setter getter

proxy

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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