Benchmark: Access to Proxy vs Object vs plain proxy

Script Preparation code:

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

Tests:

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

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:130.0) Gecko/20100101 Firefox/130.0

Browser/OS: Firefox 130 on Ubuntu

View result in a separate tab

Test name	Executions per second
Object access	1880421760.0 Ops/sec
Proxy access	423114976.0 Ops/sec
Proxy with get handler access	71692960.0 Ops/sec
only-proxy	104691568.0 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 benchmark and its test cases.

**Benchmark Overview**

The benchmark compares the performance of three approaches to access data stored in an object:

1. **Plain Object**: Directly accessing the `value` property of the object using dot notation (`object.value`).
2. **Proxy**: Using a proxy object, which is a special type of object that allows you to intercept and modify access to its properties.
3. **Proxy with Get Handler**: Creating a proxy object with a get handler, which specifies how to handle requests for property values.

**Library Used**

The `Reflect.get` method is used in the benchmark. This method returns the value of a specified property on an object, allowing you to dynamically access nested properties without using dot notation.

**JavaScript Features and Syntax**

The benchmark uses JavaScript features and syntax such as:

* **Proxy objects**: Introduced in ECMAScript 2015 (ES6), proxy objects allow you to intercept and modify access to properties.
* **Get handlers**: Also introduced in ES6, get handlers provide a way to customize how property values are accessed.

**Options Compared**

The benchmark compares the performance of three options:

1. **Plain Object Access**: Directly accessing the `value` property using dot notation (`object.value`).
2. **Proxy Access**: Using a proxy object to access the `value` property (`proxy.value`).
3. **Proxy with Get Handler Access**: Creating a proxy object with a get handler to access the `value` property (`proxyWithHandler.value`).

**Pros and Cons**

* **Plain Object Access**:
	+ Pros: Simple, widely supported, and efficient for small objects.
	+ Cons: May lead to slower performance for large objects due to the need to traverse nested properties.
* **Proxy Access**:
	+ Pros: Allows for more flexibility in accessing nested properties, can be used for security or optimization purposes.
	+ Cons: May introduce additional overhead due to the creation and maintenance of proxy objects.
* **Proxy with Get Handler Access**:
	+ Pros: Provides fine-grained control over property access, allowing for optimizations or custom behavior.
	+ Cons: May add complexity to code and require more resources (memory and CPU) compared to plain object access.

**Other Alternatives**

If you need to optimize performance or implement custom access control mechanisms, other alternatives might include:

* Using `Object.getOwnPropertyDescriptor` to retrieve property descriptors and then accessing the value through a custom function.
* Implementing a custom getter function using the `get` keyword on an object.
* Utilizing third-party libraries or frameworks that provide optimized data access mechanisms.

Keep in mind that these alternatives may require additional setup, maintenance, or resources compared to using proxy objects with get handlers.

Related benchmarks:

Access to Proxy vs Object vs plain proxy (version: 0)

Comparing performance of: Object access vs Proxy access vs Proxy with get handler access vs only-proxy

Created: 2 years ago by: Guest

Jump to the latest result

Object access

Proxy access

Proxy with get handler access

only-proxy

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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