Benchmark: apply vs spread - MeasureThat.net

Script Preparation code:

window.top.tests = {control:[], apply:[], spread:[]};
window.test = (new Array(10)).fill(null);
window.cutoff = 5000;

Tests:

Apply
window.top.tests.concat = window.top.tests.apply.push.apply(window.top.tests.apply, window.test); if (window.top.tests.apply.length > window.cutoff) { window.top.tests.apply = []; console.log('reset apply'); }
Spread
window.top.tests.spread.push(...window.test); if (window.top.tests.spread.length > window.cutoff) { window.top.tests.spread = []; console.log('reset spread'); }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Apply
Spread

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 2 years ago)

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

Browser/OS: Yandex Browser 22 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Apply	393124.9 Ops/sec
Spread	655090.3 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 Benchmark Definition json and explain what is being tested.

**What is being tested?**

MeasureThat.net is testing two different ways to append elements to an array in JavaScript:

1. **Push method**: This involves using the `push` method on the array, which adds one or more elements to the end of the array.
2. **Spread operator (`...`)**: This involves using the spread operator to add multiple elements to the array.

**Options compared**

The benchmark is comparing two options:

* `Apply`: This option uses a nested call to `push`, where the result of another `apply` call is passed as an argument to the final `push`.
* `Spread`: This option uses the spread operator (`...`) to add multiple elements to the array.

**Pros and Cons**

Here are some pros and cons for each approach:

* **Push method (Apply)**:
	+ Pros: Simple, straightforward, and widely supported.
	+ Cons: Can be slower than the spread operator due to the nested call.
* **Spread operator (`...`) (Spread)**:
	+ Pros: More concise, can be faster, and has better cache performance.
	+ Cons: Requires a modern JavaScript engine that supports the spread operator.

**Library/Language Features**

There is no library being used in this benchmark. However, it's worth noting that the spread operator (`...`) was introduced in ECMAScript 2015 (ES6), so older browsers may not support it.

**Special JS features/syntax**

The benchmark uses a feature of JavaScript called `eval`, which allows code to be executed at runtime. This is used to create a new array by calling `new Array(10)`. The spread operator (`...`) also relies on this feature, as it needs to execute the expression that creates an array with multiple elements.

**Other alternatives**

If you're looking for alternative ways to append elements to an array, here are a few options:

* **Using `push` multiple times**: Instead of using `apply`, you can simply use `push` multiple times: `window.top.tests.apply.push(window.test);`.
* **Using `concat`**: You can also use the `concat` method to create a new array: `window.top.tests.concat = window.top.tests.push(window.test);`.

Keep in mind that these alternatives may have different performance characteristics and may not be suitable for all use cases.

Related benchmarks:

apply vs spread (version: 0)

Comparing the various ways to append to a large array

Comparing performance of: Apply vs Spread

Created: 2 years ago by: Guest

Jump to the latest result

Apply

Spread

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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