Benchmark: Array push vs destruct

Script Preparation code:

var arr = [];

for(i=0; i<1000000; i++){
	arr.push(1)
}

Tests:

Array.push
arr = [...arr, 1]
Destruct and construct
arr = [...arr, 1]

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.push
Destruct and construct

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: one year ago)

User agent: Mozilla/5.0 (iPhone; CPU iPhone OS 16_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Mobile/15E148 Safari Line/13.2.0

Browser/OS: Mobile Safari 16 on iOS 16.1

View result in a separate tab

Test name	Executions per second
Array.push	129.1 Ops/sec
Destruct and construct	126.8 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net.

**What is tested?**

The provided benchmark tests two approaches to adding elements to an array in JavaScript:

1. `Array.push()`
2. Destructuring and constructing a new array using the spread operator (`[...arr, 1]`)

**Options compared:**

We have two options being compared:

* **Option 1: `Array.push()`**: This is a built-in method for adding elements to an array in JavaScript. It modifies the original array.
* **Option 2: Destructuring and constructing a new array using `[...arr, 1]`**: This approach creates a new array by spreading the existing array and appending a new element.

**Pros and Cons of each approach:**

* **`Array.push()`**:
	+ Pros:
		- Efficient for large arrays since it modifies the original array.
		- Typically faster due to its optimized implementation.
	+ Cons:
		- Modifies the original array, which might be unintended behavior.
		- May not be suitable for certain use cases where preserving the original array is crucial.
* **Destructuring and constructing a new array using `[...arr, 1]`**:
	+ Pros:
		- Preserves the original array, making it more predictable and easier to reason about.
		- Does not modify the original array, which can be beneficial in certain scenarios.
	+ Cons:
		- Typically slower due to the overhead of creating a new array and pushing elements into it.

**Library/Utility usage:**

There is no explicit library or utility being used in this benchmark. The `Array.push()` method is a built-in JavaScript function, while the spread operator (`[...arr, 1]`) is a feature introduced in ECMAScript 2015 (ES6).

**Special JS features/syntax:**

The benchmark uses the spread operator (`[...arr, 1]`), which is a ES6 feature. This syntax is used to create a new array by spreading an existing array and appending elements.

**Other alternatives:**

If you're looking for alternative approaches to adding elements to an array in JavaScript, here are a few options:

* Using `concat()` method: `arr.concat([1])`
* Using `Array.prototype.push.call(arr, 1)`
* Using `slice().push(1)`

However, it's worth noting that these alternatives may not be as efficient or readable as the original approaches being compared in this benchmark.

Related benchmarks:

Array push vs destruct (version: 0)

Comparing performance of: Array.push vs Destruct and construct

Created: one year ago by: Guest

Jump to the latest result

Array.push

Destruct and construct

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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