Benchmark: Direct call vs bind vs call vs apply, with spread syntax

Script Preparation code:

function test(msg) {
  var d = msg;
}

Tests:

direct call
test("Hello")
direct call with spread syntax
test(...["Hello"])
bind
test.bind(null, "Hello")()
bind with spread syntax
test.bind(null, ...["Hello"])()
call
test.call(null, "Hello")
call with spread syntax
test.call(null, ...["Hello"])
apply
test.apply(null, ["Hello"])

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
direct call
direct call with spread syntax
bind
bind with spread syntax
call
call with spread syntax
apply

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) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36 Edg/134.0.0.0

Browser/OS: Chrome 134 on Windows

View result in a separate tab

Test name	Executions per second
direct call	207809296.0 Ops/sec
direct call with spread syntax	209205920.0 Ops/sec
bind	199656544.0 Ops/sec
bind with spread syntax	186519712.0 Ops/sec
call	200522736.0 Ops/sec
call with spread syntax	194401536.0 Ops/sec
apply	193522288.0 Ops/sec

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):

LLMs can make mistakes. Check important info.

The benchmark under examination involves measuring the performance of different method invocation techniques in JavaScript, specifically for a function defined in the script preparation code. The objective is to compare the efficiency of direct function calls against the use of `.bind()`, `.call()`, and `.apply()`, including variations that use the spread syntax.

### Benchmark Options Compared

1. **Direct Call**:
   - **Definition**: `test("Hello")`
   - **Pros**: This is the simplest and most direct way to invoke a function. It typically has the best performance since it incurs no additional overhead.
   - **Cons**: Limited flexibility in altering the context (`this`) or passing parameters dynamically.

2. **Direct Call with Spread Syntax**:
   - **Definition**: `test(...["Hello"])`
   - **Pros**: It allows the use of an array to pass arguments to the function. This maintains a simple invocation while enabling flexibility in parameter passing.
   - **Cons**: While the code structure allows for dynamic argument lists, performance can be slightly lower than a simple direct call due to the additional operation of spreading the array.

3. **Using `.bind()`**:
   - **Definition**: `test.bind(null, "Hello")()`
   - **Pros**: The `.bind()` method creates a new function with a specified `this` value and initial arguments, which is handy for setting context or predefining parameters.
   - **Cons**: This approach involves creating a new function, which introduces additional overhead compared to a direct call. The bound function must also be executed afterward.

4. **Using `.bind()` with Spread Syntax**:
   - **Definition**: `test.bind(null, ...["Hello"])()`
   - **Pros**: Similar to using `.bind()` but adds the capability to gather arguments from an array. This can be useful for dynamically changing the number of parameters.
   - **Cons**: The overhead of binding a function still applies while adding the complexity of spread operation.

5. **Using `.call()`**:
   - **Definition**: `test.call(null, "Hello")`
   - **Pros**: The `.call()` method allows invocation of the function with a specific `this` context and allows for passing parameters directly. It’s efficient for a fixed parameter list.
   - **Cons**: No ability to pass an array of arguments directly unless unpacked explicitly, which can limit its flexibility.

6. **Using `.call()` with Spread Syntax**:
   - **Definition**: `test.call(null, ...["Hello"])`
   - **Pros**: Combines the ability to define the `this` context with the flexibility of array unpacking for arguments.
   - **Cons**: Similar to direct call performance but can be slightly less efficient due to the array spreading.

7. **Using `.apply()`**:
   - **Definition**: `test.apply(null, ["Hello"])`
   - **Pros**: Ideal for invoking functions with an array of parameters, making it flexible for variable argument counts.
   - **Cons**: Maintains some performance overhead relative to a direct call since it requires the function to be invoked through another method.

### Benchmark Results

The benchmark results indicate the number of executions per second for each invocation method, with direct calls consistently outperforming the others as expected:

- **Direct Call**: 9733207.0 executions/sec (Best performance)
- **Call**: 6184750.0 executions/sec
- **Bind**: 5872189.0 executions/sec
- **Apply**: 5777715.5 executions/sec
- **Direct Call with Spread Syntax**: 5766241.0 executions/sec
- **Call with Spread Syntax**: 5522596.5 executions/sec
- **Bind with Spread Syntax**: 5248574.5 executions/sec (Lowest performance)

### Considerations

- **Performance Impact**: Generally, as the method of invocation adds more abstraction (such as binding or applying), the performance tends to decrease due to overhead.
- **Context Management**: While direct calls are the fastest, using `.call()`, `.apply()`, or `.bind()` becomes necessary when you need to control the context of `this`, especially in more complex applications or when dealing with callback functions.
  
### Alternatives

- **Arrow Functions**: This syntax was not specifically tested in this benchmark, but arrow functions in JavaScript can simplify writing functions that lexically bind `this`, potentially affecting how these methods are used in larger codebases.
- **Native Function Calling**: Depending on the use case, some engines may optimize function calls better for specific scenarios, but this varies widely across implementations and scenarios.
  
In conclusion, the benchmark clearly illustrates performance trade-offs in JavaScript function invocation strategies. Developers should choose the appropriate method based on their specific context requirements and the importance of performance in their applications.

Related benchmarks:

Direct call vs bind vs call vs apply, with spread syntax (version: 1)

Comparing performance of: direct call vs direct call with spread syntax vs bind vs bind with spread syntax vs call vs call with spread syntax vs apply

Created: 2 months ago by: Guest

Jump to the latest result

direct call

direct call with spread syntax

bind

bind with spread syntax

call

call with spread syntax

apply

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gpt-4o-mini, generated 2 months ago):