Benchmark: Array.prototype.push vs Array.prototype.push.apply1

Script Preparation code:

var arr1 = Array(100).fill([{n: ''}]);
var arr2 = Array(100).fill([{n: ''}]);

Tests:

Array.prototype.push
arr1.push(...arr2)
Array.prototype.push.apply
Array.prototype.push.apply(arr1, arr2)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.prototype.push
Array.prototype.push.apply

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_6) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.0 Safari/605.1.15

Browser/OS: Safari 13 on Mac OS X 10.14.6

View result in a separate tab

Test name	Executions per second
Array.prototype.push	133677.0 Ops/sec
Array.prototype.push.apply	237245.4 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark definition and test cases to understand what's being tested.

**Benchmark Definition JSON**

The `Benchmark Definition` json represents a microbenchmark that compares two approaches for adding elements to an array using `Array.prototype.push`. The benchmark defines:

1. **Script Preparation Code**: Two arrays, `arr1` and `arr2`, are created with 100 elements each. Each element is an object with a property `n`.
2. **Html Preparation Code**: There is no HTML preparation code specified.

The purpose of this benchmark is to compare the performance of two approaches:

**Approach 1: Array.prototype.push**

```javascript
arr1.push(...arr2);
```

**Approach 2: Array.prototype.push.apply**

```javascript
Array.prototype.push.apply(arr1, arr2);
```

Both approaches aim to add all elements from `arr2` to the end of `arr1`.

**Options Compared**

The benchmark compares two options:

1. **Spreading operator (`...`)**: Used in `arr1.push(...arr2)`, this approach creates a new array with the elements from `arr2` and adds it to `arr1`.
2. **`Array.prototype.push.apply()` method**: Used in `Array.prototype.push.apply(arr1, arr2)`, this approach applies an iterable (in this case, `arr2`) to the end of `arr1`.

**Pros and Cons**

* **Spreading operator (`...`)**:
	+ Pros: More concise, readable code. Does not require explicit method calls.
	+ Cons: May incur additional overhead due to the creation of a new array.
* **`Array.prototype.push.apply()` method**:
	+ Pros: Can be more efficient for large datasets, as it avoids creating a new array.
	+ Cons: Requires an explicit method call and may have slightly less readable code.

**Library**

None of the test cases use any external libraries. The benchmark only utilizes built-in JavaScript features.

**Special JS Features/Syntax**

There are no special JavaScript features or syntax used in these test cases. Both approaches rely on standard JavaScript functionality.

**Other Alternatives**

For adding elements to an array, other alternatives exist:

1. **`Array.prototype.concat()` method**: Concatenates one or more arrays with the specified value.
2. **Spreading operator (`...`) with `concat()`**: Combines the spreading operator with the `concat()` method for added flexibility.

Keep in mind that these alternatives may have different performance characteristics depending on the specific use case and browser.

In conclusion, this benchmark compares two approaches for adding elements to an array using `Array.prototype.push`. The spreading operator (`...`) is compared to the `Array.prototype.push.apply()` method. While both approaches have pros and cons, the benchmark provides a useful comparison of these two methods in terms of performance.

Related benchmarks:

Array.prototype.push vs Array.prototype.push.apply1 (version: 0)

Comparing performance of: Array.prototype.push vs Array.prototype.push.apply

Created: 4 years ago by: Guest

Jump to the latest result

Array.prototype.push

Array.prototype.push.apply

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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