Benchmark: Array .push() vs .unshift(), 1M elements

Script Preparation code:

var arr = []

Tests:

.unshift()
for (var i = 0; i < 1000000; i++) { arr.unshift(42) }
.push()
for (var i = 0; i < 1000000; i++) { arr.push(42) }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
.unshift()
.push()

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (X11; Linux x86_64; rv:92.0) Gecko/20100101 Firefox/92.0

Browser/OS: Firefox 92 on Linux

View result in a separate tab

Test name	Executions per second
.unshift()	0.4 Ops/sec
.push()	23.6 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 JSON and explain what is tested, compared, and their pros and cons.

**Benchmark Definition**

The benchmark is comparing the performance of two approaches: `arr.push(42)` and `arr.unshift(42)`, on an empty array `var arr = []`. The goal is to measure which approach is faster when adding 1 million elements to the array.

**Script Preparation Code**

The script preparation code is a simple initialization of the array `var arr = []`.

**Html Preparation Code**

There is no HTML preparation code, which means that the benchmark only tests the JavaScript performance and does not consider any DOM-related overhead or other non-JavaScript aspects.

**Individual Test Cases**

There are two test cases:

1. **`.unshift()`**: This test case uses the `arr.unshift(42)` approach, which adds an element to the beginning of the array.
2. **`.push()`**: This test case uses the `arr.push(42)` approach, which adds an element to the end of the array.

**Libraries and Special JS Features**

There are no libraries used in this benchmark. However, it's worth noting that both `.unshift()` and `.push()` methods rely on JavaScript's built-in array data structure, so there is no special JS feature or syntax involved.

**Pros and Cons of Each Approach**

1. **`.unshift()`**:
	* Pros: Faster for smaller arrays, since it reduces the number of elements that need to be shifted down when an element is added to the beginning.
	* Cons: Slower for larger arrays, since it requires shifting all elements down by one position.
2. **`.push()`**:
	* Pros: Faster for larger arrays, since it only requires adding a single element to the end and doesn't require any shifting.
	* Cons: Slower for smaller arrays, since it involves more overhead due to the need to shift elements up.

**Other Considerations**

When deciding between `.unshift()` and `.push()`, consider the typical use case:

* If you're adding an element to the beginning of the array (e.g., sorting or reversing), use `arr.unshift()`.
* If you're adding an element to the end of the array, use `arr.push()`.

**Other Alternatives**

If you need to optimize array operations further, consider using other approaches, such as:

1. Using a different data structure, like a linked list or a heap.
2. Utilizing JavaScript's built-in functions, like `Array.prototype.slice()` and `Array.prototype.splice()`, which can be more efficient than direct array manipulation.
3. Leveraging modern JavaScript features, like parallel processing with Web Workers or async/await, to speed up computationally intensive tasks.

Keep in mind that the best approach depends on your specific use case and requirements.

Related benchmarks:

Array .push() vs .unshift(), 1M elements (version: 0)

Comparing performance of: .unshift() vs .push()

Created: 4 years ago by: Guest

Jump to the latest result

.unshift()

.push()

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):