Benchmark: Access to 2xProxy vs Object

Script Preparation code:

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

Tests:

Object access
object.value;
Proxy access
proxy.value
Proxy with get handler access
proxyWithHandler.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

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 3 years ago)

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

Browser/OS: Chrome 89 on Windows

View result in a separate tab

Test name	Executions per second
Object access	5839650.0 Ops/sec
Proxy access	4151654.8 Ops/sec
Proxy with get handler access	1159858.4 Ops/sec

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

LLMs can make mistakes. Check important info.

**Benchmark Overview**

The MeasureThat.net benchmark measures the performance of JavaScript microbenchmarks, specifically comparing the execution times of three different approaches: direct object access, proxy access, and proxy access with a getter handler.

**Benchmark Definition JSON Analysis**

The benchmark definition JSON contains information about the script preparation code, which is used to create objects, proxies, and a custom getter handler. Here's a breakdown of the relevant parts:

* `Script Preparation Code`: This section creates an object `object` with a property `value`, sets up two proxy objects (`proxy` and `proxyWithHandler`) using the `Proxy` constructor, and defines a custom getter handler for `proxyWithHandler`. The script is executed to create these proxies.
* `Html Preparation Code`: This section is empty, indicating that no HTML preparation code is required.

**Options Compared**

The benchmark compares three options:

1. **Direct Object Access**: Directly accessing the `value` property of the `object` using dot notation (`object.value`).
2. **Proxy Access**: Accessing the `value` property of the `proxy` object.
3. **Proxy with Get Handler Access**: Accessing the `value` property of the `proxyWithHandler` object, which uses a custom getter handler to delegate access to the underlying object.

**Pros and Cons**

Here's a brief summary of the pros and cons of each approach:

* **Direct Object Access**:
	+ Pros: Simple, efficient, and predictable.
	+ Cons: May incur additional overhead due to type checking and other mechanisms.
* **Proxy Access**:
	+ Pros: Can provide additional functionality (e.g., caching) and flexibility.
	+ Cons: May introduce additional overhead due to proxy creation and lookup.
* **Proxy with Get Handler Access**:
	+ Pros: Provides a way to customize access to the underlying object while maintaining encapsulation.
	+ Cons: Requires careful design of the getter handler, which can add complexity.

**Library and Custom Getter Handler**

The `Reflect.get()` function is used in the custom getter handler to delegate access to the underlying object. This function allows for more fine-grained control over property access, making it easier to implement custom logic without modifying the underlying object.

**Special JS Feature or Syntax**

There are no special JavaScript features or syntax mentioned in this benchmark definition. It uses standard JavaScript constructs and does not rely on any experimental or proposed features.

**Alternatives**

If you're interested in exploring alternative approaches for proxying objects, consider:

* Using a library like `ProxyHandler` (ECMAScript 2015) to create a custom getter handler.
* Implementing your own proxy object using a wrapper class or function.
* Utilizing other JavaScript features, such as decorators (for a more modern approach), that provide similar functionality.

Keep in mind that each alternative may introduce additional complexity and trade-offs.

Related benchmarks:

Access to 2xProxy vs Object (version: 0)

Comparing performance of: Object access vs Proxy access vs Proxy with get handler access

Created: 3 years ago by: Guest

Jump to the latest result

Object access

Proxy access

Proxy with get handler access

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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