Benchmark: Proxy class vs object literal

Script Preparation code:

class ClassObject {
    constructor(a, b, c) {
        this.a = a
        this.b = b
        this.c = c
    }
}

function ObjectLiteral(a, b, c) {
    return {
        a,
        b,
        c
    }
}

function createClassObjectProxy(a, b, c) {
    return new Proxy(new ClassObject(a, b, c), {
        get(target, key, receiver) {
            return Reflect.get(target, key, receiver)
        },
        set(target, key, value, receiver) {
            Reflect.set(target, key, value, receiver)
            return true;
        }
    })
}

function createObjectLiteralProxy(a, b, c) {
    return new Proxy(ObjectLiteral(a, b, c), {
        get(target, key, receiver) {
            return Reflect.get(target, key, receiver)
        },
        set(target, key, value, receiver) {
            Reflect.set(target, key, value, receiver)
            return true;
        }
    })
}

const classObjectProxy = createClassObjectProxy(1, 2, 3)
const objectLiteralProxy = createObjectLiteralProxy(1, 2, 3)

function getClassObjectProxy() {
    return classObjectProxy;
}

function getObjectLiteralProxy() {
    return objectLiteralProxy;
}

Tests:

Initialize Proxy: Class object
const obj = createClassObjectProxy(1,2,3)
Initialize Proxy: Object literal
const obj = createObjectLiteralProxy(1,2,3)
Get property: Class object
const obj = getClassObjectProxy() const a = obj.a const b = obj.b const c = obj.c
Get property: Object literal
const obj = getObjectLiteralProxy() const a = obj.a const b = obj.b const c = obj.c
Set property: Class object
const obj = getClassObjectProxy() obj.a = 2 obj.b = 3 obj.c = 4
Set property: Object literal
const obj = getObjectLiteralProxy() obj.a = 2 obj.b = 3 obj.c = 4

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Initialize Proxy: Class object
Initialize Proxy: Object literal
Get property: Class object
Get property: Object literal
Set property: Class object
Set property: Object literal

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:128.0) Gecko/20100101 Firefox/128.0

Browser/OS: Firefox 128 on Linux

View result in a separate tab

Get property: Class object

20.2M/s

Get property: Object literal

14.8M/s

Initialize Proxy: Object literal

2.5M/s

Initialize Proxy: Class object

2.5M/s

Set property: Class object

1.0M/s

Set property: Object literal

1.0M/s

View exact numbers

Test name	Executions per second
✓ Get property: Class object	20,246,478 Ops/sec
Get property: Object literal	14,794,648 Ops/sec
Initialize Proxy: Object literal	2,547,109 Ops/sec
Initialize Proxy: Class object	2,511,943 Ops/sec
Set property: Class object	1,020,308 Ops/sec
Set property: Object literal	1,015,969 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down what is being tested in the provided JSON benchmark.

**Benchmark Definition**

The test measures the performance of two approaches to create a proxy object:

1. **Class object**: Using a `class` keyword to define a class and then creating a proxy object from that class using the `Proxy` constructor.
2. **Object literal**: Defining an object literal with three properties (a, b, c) and then creating a proxy object from that literal using the same `Proxy` constructor.

**Options compared**

Two options are being compared:

* Creating a proxy object from a class (`createClassObjectProxy`) vs. creating a proxy object from an object literal (`createObjectLiteralProxy`)
* Getting properties of the proxy object (`get property: Class object` and `get property: Object literal`)
* Setting properties on the proxy object (`set property: Class object` and `set property: Object literal`)

**Pros and Cons**

Here are some pros and cons of each approach:

* **Class object**:
	+ Pros:
		- Can be more flexible and reusable, as classes can have static methods and other features.
		- May lead to better performance, as the `Proxy` constructor only needs to access the class's properties once.
	+ Cons:
		- Requires defining a separate class file, which may increase compilation time.
		- May require additional setup for dependency injection or other design patterns.
* **Object literal**:
	+ Pros:
		- Easier to create and understand, as it is simply an object with three properties.
		- Does not require defining a separate class file, making it faster to set up.
	+ Cons:
		- May lead to slower performance, as the `Proxy` constructor needs to access each property individually.

**Other considerations**

* Both approaches use the `Proxy` constructor, which is a built-in JavaScript feature for creating proxy objects. This means that both approaches will have similar performance characteristics, as they rely on the same underlying mechanism.
* The test also measures the execution speed of getting and setting properties on the proxy object, which can impact performance depending on the specific use case.

**Library and syntax**

The `Proxy` constructor is a built-in JavaScript feature that allows creating proxy objects. It does not require any additional libraries or dependencies.

In terms of syntax, both approaches are relatively straightforward:

* Class object: `class MyClass { constructor() {} } const obj = new MyClass(); Proxy(obj, {})`
* Object literal: `{a: 1, b: 2, c: 3}`

Overall, the test measures the performance difference between two approaches to creating proxy objects in JavaScript, with both approaches using a similar underlying mechanism.

Proxy class vs object literal (version: 0)

Comparing performance of: `Initialize Proxy: Class object vs Initialize Proxy: Object literal vs Get property: Class object vs Get property: Object literal vs Set property: Class object vs Set property: Object literal`

Created: one year ago by: Registered User

Go to the latest result

Initialize Proxy: Class object

Initialize Proxy: Object literal

Get property: Class object

Get property: Object literal

Set property: Class object

Set property: Object literal

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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

Proxy class vs object literal (version: 0)

Comparing performance of: Initialize Proxy: Class object vs Initialize Proxy: Object literal vs Get property: Class object vs Get property: Object literal vs Set property: Class object vs Set property: Object literal

Created: one year ago by: Registered User

Go to the latest result

Initialize Proxy: Class object

Initialize Proxy: Object literal

Get property: Class object

Get property: Object literal

Set property: Class object

Set property: Object literal

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: `Initialize Proxy: Class object vs Initialize Proxy: Object literal vs Get property: Class object vs Get property: Object literal vs Set property: Class object vs Set property: Object literal`