Benchmark: Access to Proxy vs Object vs computed

Script Preparation code:

object = {
    value: 'data'
};
proxy = new Proxy(object, {})
proxyWithHandler = new Proxy(object, {
    get(target, prop, receiver) {
        return Reflect.get(target, prop, receiver)
    }
})

class Obj {
    _value = 'data';

    get value() {
        return this._value;
    }
}
computed = new Obj();

Tests:

Object access
object.value;
Proxy access
proxy.value
Proxy with get handler access
proxyWithHandler.value
Access through computed get
computed.value

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Object access
Proxy access
Proxy with get handler access
Access through computed get

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark and explain what's being tested.

**Benchmark Overview**

The benchmark compares the performance of three different ways to access a value within an object:

1. **Direct Object Access**: accessing `object.value`
2. **Proxy Access**: using a proxy (`proxy` object) created with `new Proxy(object, {})`
3. **Computed Access through a getter method**: accessing `computed.value`, where `computed` is an instance of the `Obj` class that overrides the `value` property with a getter method.

**Options Comparison**

The three options are compared to determine which one is the fastest.

* **Pros and Cons:**
	+ Direct Object Access:
		- Pros: simple, straightforward access.
		- Cons: may involve additional overhead due to JavaScript's internal workings (e.g., property lookup, caching).
	+ Proxy Access:
		- Pros: can be used for more complex scenarios where direct object access is not suitable (e.g., intercepting or modifying requests).
		- Cons: introduces additional overhead due to the proxy creation and management.
	+ Computed Access through a getter method:
		- Pros: allows for fine-grained control over property access, enabling caching or other optimizations.
		- Cons: requires creating an instance of the `Obj` class and defining a getter method, which can add overhead.
* **Other Considerations:** The benchmark also considers the impact of using a proxy with a custom `get` handler (`proxyWithHandler`). This option is similar to Proxy Access but with additional overhead due to the custom handler.

**Library and Special JS Features**

The benchmark uses the following JavaScript libraries or features:

* `Proxy`: a built-in JavaScript object that allows creating proxies, which are objects that wrap another object.
* `Obj` class: a custom class defined in the script preparation code. This class overrides the `value` property with a getter method, allowing for computed access to the value.

**Test Cases**

Each test case measures the execution time of accessing the `value` property through one of the three options:

1. **Object Access**: accesses `object.value`
2. **Proxy Access**: uses the proxy (`proxy`) object
3. **Proxy with Get Handler Access**: uses a custom `get` handler in the proxy (`proxyWithHandler`)
4. **Access through Computed Get**: uses an instance of the `Obj` class to access the value through its getter method.

**Alternatives**

Other alternatives for accessing properties within objects might include:

* Using a library like Lodash or Underscore.js, which provides utility functions for working with objects.
* Implementing a custom solution using JavaScript's built-in `Object.defineProperty()` function to define getters and setters for specific properties.
* Using a different approach, such as caching the accessed value or using a more efficient data structure.

Related benchmarks:

Access to Proxy vs Object vs computed (version: 0)

Comparing performance of: Object access vs Proxy access vs Proxy with get handler access vs Access through computed get

Created: 2 years ago by: Guest

Jump to the latest result

Object access

Proxy access

Proxy with get handler access

Access through computed get

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

No previous run results

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