Benchmark: Proxy vs Object vs Object.setPrototypeOf

Script Preparation code:

window.basic = {a : 1, b: 2};
window.proxy = new Proxy({a : 1, b: 2}, {get : (t, p) => t[p]})
window.proto = Object.setPrototypeOf({}, {a : 1, b: 2})

Tests:

Basic
let a = basic.a; let b = basic.b;
Proxy
let a = proxy.a; let b = proxy.b;
Proto
let a = proto.a; let b = proto.b;

Historical Performance Data aggregated from 13 community runs

Desktop Results:

Chrome 13 runs

Basic

10.0M/s

Proto

9.7M/s

Proxy

8.0M/s

Fastest: Basic (1.2x faster)

View exact numbers

✓ Basic: 10,006,764 ops/sec
• Proto: 9,666,394 ops/sec
• Proxy: 8,010,266 ops/sec

Results show median performance across all community submissions. Run this benchmark yourself to verify on your device.

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Basic
Proxy
Proto

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Firefox 138 on Linux

View result in a separate tab

Basic

869.2M/s

Proto

797.2M/s

Proxy

23.6M/s

View exact numbers

Test name	Executions per second
✓ Basic	869,172,736 Ops/sec
Proto	797,229,376 Ops/sec
Proxy	23,617,406 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the provided benchmark definition and explain what's being tested.

**Benchmark Definition:**

The test is comparing three approaches to access nested properties of an object:

1. **Basic**: Direct property access (`basic.a` and `basic.b`)
2. **Proxy**: Using a Proxy object (`proxy.a` and `proxy.b`) to gain access to the nested properties
3. **Proto**: Using `Object.setPrototypeOf()` to set up a prototype chain for the object (`proto.a` and `proto.b`)

**Options Compared:**

The test is comparing the performance of these three approaches:

* **Pros of each approach:**
	+ Basic: Simple and straightforward, easy to understand and implement.
	+ Proxy: Provides a way to intercept and modify property access, which can be useful in certain situations.
	+ Proto: Allows for more fine-grained control over object inheritance and prototype chain management.
* **Cons of each approach:**
	+ Basic: May lead to slower performance due to the need to traverse the property path multiple times.
	+ Proxy: Can introduce additional overhead due to the creation of a proxy object and its associated logic.
	+ Proto: Requires understanding of object prototypes and inheritance, which can add complexity.

**Library Used:**

The test uses the built-in `Proxy` constructor in JavaScript, which allows for creating objects that provide custom behavior for certain property access operations. The `Object.setPrototypeOf()` method is also used to set up a prototype chain for an object.

**Special JS Feature/Syntax:**

This benchmark does not use any special JavaScript features or syntax beyond what's standard in the language.

**Other Alternatives:**

If you're interested in exploring alternative approaches, here are a few options:

* **Dotted notation**: Accessing properties using dot notation (`basic.a.b`) instead of bracket notation.
* **Bracket notation**: Using bracket notation to access nested properties (`basic['a']` and `proxy['b']`).
* **Function calls**: Using function calls to access nested properties (e.g., `function getA() { return basic.a; }`).

Keep in mind that these alternatives may have different performance characteristics or trade-offs, depending on the specific use case.

**Benchmark Preparation Code:**

The script preparation code defines three objects:

* `basic`: An object with two properties (`a` and `b`) set to 1 and 2, respectively.
* `proxy`: A Proxy object created over an object with the same properties as `basic`. The proxy uses a getter function to return the value of each property when accessed.
* `proto`: An object that inherits from an empty object using `Object.setPrototypeOf()`. The prototype is set up to have the same properties as `basic`.

The HTML preparation code is not provided, suggesting that it's not necessary for this specific benchmark.

**Latest Benchmark Result:**

The latest benchmark results show that:

* **Proto**: Performs best with an execution rate of 3189167.0 executions per second.
* **Basic**: Followed by **Proxy**, with an execution rate of 2734830.0 and 2470443.0, respectively.

These results suggest that using `Object.setPrototypeOf()` to set up a prototype chain for the object provides the best performance in this specific benchmark.

Proxy vs Object vs Object.setPrototypeOf (version: 1)

Comparing performance of: `Basic vs Proxy vs Proto`

Created: 5 years ago by: Registered User

Go to the latest result

Basic

Proxy

Proto

Historical Performance Data aggregated from 13 community runs

Desktop Results:

Chrome 13 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Proxy vs Object vs Object.setPrototypeOf (version: 1)

Comparing performance of: Basic vs Proxy vs Proto

Created: 5 years ago by: Registered User

Go to the latest result

Basic

Proxy

Proto

Historical Performance Data aggregated from 13 community runs

Desktop Results:

Chrome 13 runs

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Related benchmarks

Comparing performance of: `Basic vs Proxy vs Proto`