Benchmark: Function call vs proxy call

HTML Preparation code:

<!--your preparation HTML code goes here-->

Script Preparation code:

function setup() {
    const obj = {
        a: 4
    }

    function getA() {
        return obj.a
    }

    const proxy = new Proxy(getA, {})

    return [getA, proxy]
}

const [_getA, _proxy] = setup()

function getExisting() {
    return [_getA, _proxy]
}

Tests:

Initial Function Call
const [getA, proxy] = setup() const a = getA()
Initial Proxy Call
const [getA, proxy] = setup() const a = proxy()
Function Call
const [getA, proxy] = getExisting() const a = getA()
Proxy Call
const [getA, proxy] = getExisting() const a = proxy()

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Initial Function Call
Initial Proxy Call
Function Call
Proxy Call

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 6 days ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/135.0.0.0 Safari/537.36

Browser/OS: Chrome 135 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Initial Function Call	25864618.0 Ops/sec
Initial Proxy Call	16831482.0 Ops/sec
Function Call	83282264.0 Ops/sec
Proxy Call	27988804.0 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 6 days ago):

LLMs can make mistakes. Check important info.

### Benchmark Overview: Function Call vs Proxy Call

The benchmark titled "Function call vs proxy call" compares the performance of two approaches for invoking a function in JavaScript: a direct function call and a call through a Proxy. Proxies are a feature in JavaScript that allow you to define custom behavior for fundamental operations on an object, such as property access, assignment, enumeration, and function invocation.

### Options Compared

1. **Direct Function Calls**
   - **Test Cases**:
     - **Initial Function Call**: Directly invoking a function (`getA()`) after initial setup.
     - **Function Call**: Invoking the same function (`getA()`) after calling the `getExisting()` function which returns the initial function and the proxy.
   
2. **Proxy Calls**
   - **Test Cases**:
     - **Initial Proxy Call**: Invoking a proxy that wraps the function (`proxy()`) directly after initial setup.
     - **Proxy Call**: Invoking the proxy after calling `getExisting()`, which returns both the function and the proxy.

### Pros and Cons

**Direct Function Calls:**
- **Pros**:
  - Faster execution time since there is no overhead associated with the Proxy.
  - Simpler and more straightforward to understand.
  
- **Cons**:
  - Cannot intercept calls, making it inflexible for scenarios requiring additional behavior (e.g., logging, validation, etc.).

**Proxy Calls:**
- **Pros**:
  - Provides the ability to customize function behavior. You can intercept calls to the function and add additional logic (e.g., logging calls, enforcing access restrictions).
  - Essential in scenarios where dynamic behavior is necessary or where tracking calls is relevant.

- **Cons**:
  - Introduces overhead due to the interception process, making it generally slower than direct calls.
  - More complex to implement and understand than direct function calls.

### Benchmark Results

The benchmark results indicate significant differences in execution speed between direct calls and proxy-enabled calls:

- **Function Call**: 83,282,264 executions per second (fastest)
- **Proxy Call**: 27,988,804 executions per second
- **Initial Function Call**: 25,864,618 executions per second
- **Initial Proxy Call**: 16,831,482 executions per second

These results confirm that direct function calls are consistently faster than proxy calls, followed by initial function calls which also perform poorly compared to the reused calls through `getExisting()`. Proxies show substantially lower performance, confirming their overhead.

### Other Considerations

While this benchmark provides clear insight into the performance characteristics of function calls versus proxy calls, it's essential to note that the right choice depends on the specific needs of your application:

- **If performance is critical** (e.g., in a rendering loop or a performance-sensitive application), then direct function calls are the clear choice.
- **If flexibility and extensibility are required** (e.g., in frameworks or libraries where additional intercepting behavior is necessary), then using proxies might be worth the performance trade-off.

### Alternatives

Other alternatives for managing behavior similar to proxies could include:

- **Function Composition**: Using higher-order functions to wrap existing functions without the overhead of proxies.
- **Decorator Pattern**: In Object-Oriented Programming, you can use decorators to enhance the behavior of functions or methods without altering their signature.
- **Middleware**: For applications like web servers, middleware could achieve some proxy-like behavior without the overhead associated with JavaScript proxies.

Ultimately, the choice between direct function calls, proxies, or other alternatives should consider both performance requirements and functional needs tailored to your specific use case.

Related benchmarks:

Function call vs proxy call (version: 1)

Comparing performance of: Initial Function Call vs Initial Proxy Call vs Function Call vs Proxy Call

Created: 6 days ago by: Registered User

Jump to the latest result

Initial Function Call

Initial Proxy Call

Function Call

Proxy Call

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 6 days ago):