Benchmark: Access to Proxy vs Object - without reflect

Script Preparation code:

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

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: one month ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:132.0) Gecko/20100101 Firefox/132.0

Browser/OS: Firefox 132 on Windows

View result in a separate tab

Test name	Executions per second
Object access	1975117824.0 Ops/sec
Proxy access	372607104.0 Ops/sec
Proxy with get handler access	83714232.0 Ops/sec

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

LLMs can make mistakes. Check important info.

I'd be happy to help you understand the benchmark being tested on MeasureThat.net.

**What is tested?**

The benchmark measures the performance difference between accessing an object's property directly (`object.value`) versus using a proxy object with a getter handler (`proxyWithHandler.value`). In this case, both `proxy` and `proxyWithHandler` point to the same underlying object (`object`).

**Options compared:**

There are three options being compared:

1. **Direct Object Access**: `object.value`
2. **Proxy Access**: `proxy.value`
3. **Proxy with Getter Handler Access**: `proxyWithHandler.value`

**Pros and Cons of each approach:**

* **Direct Object Access**:
	+ Pros: Fast, straightforward, and easy to implement.
	+ Cons: May involve additional overhead for things like bounds checking, type checking, or garbage collection.
* **Proxy Access**:
	+ Pros: Can provide more fine-grained control over property access (e.g., caching, transformation), can help with performance optimization, and is often used in libraries like Object-proxy for debugging purposes.
	+ Cons: May introduce additional overhead due to the creation of a new proxy object, which needs to be managed by the JavaScript engine. Additionally, getting the value from a proxy may involve more complex operations compared to direct access.
* **Proxy with Getter Handler Access**:
	+ Pros: Allows you to intercept and modify property access in a way that's not possible with plain proxies. This can be useful for caching or transformation purposes.
	+ Cons: May introduce additional overhead due to the creation of a new proxy object, which needs to be managed by the JavaScript engine.

**Other considerations:**

* The use of a `Proxy` object with an empty handler (`{}`) implies that no custom behavior is being applied. However, if you were to create a more complex getter handler, it could potentially introduce additional overhead.
* The fact that all browsers are running on Linux desktop platforms and using the Chrome browser might limit the generality of these results.

**Library/Functionality used:**

In this benchmark, no external libraries or functions are explicitly mentioned. However, the use of `Proxy` objects is a built-in JavaScript feature since ES6 (ECMAScript 2015).

There is no mention of any special JavaScript features or syntax being used in this benchmark.

**Alternatives:**

If you're interested in exploring similar benchmarks, MeasureThat.net has many other tests that compare different JavaScript scenarios, such as:

* Accessing an array element vs. accessing a Map key
* Using `new Date()` vs. using a timestamp to represent time elapsed
* Comparing the performance of object literals and arrays

Keep in mind that benchmark results can vary depending on specific use cases, platforms, and browser versions. It's always interesting to see how different approaches compare under various conditions.

Related benchmarks:

Access to Proxy vs Object - without reflect (version: 0)

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

Created: 2 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):