Benchmark: Array .push() vs .unshift() vs spread

Script Preparation code:

var arr = [10]

Tests:

.unshift()
arr.unshift(42)
.push()
arr.push(42)
Spread
arr = [42,...arr]

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

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

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Firefox 134 on Linux

View result in a separate tab

Test name	Executions per second
.unshift()	442417.3 Ops/sec
.push()	25841922.0 Ops/sec
Spread	0.2 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's dive into the benchmark and explain what's being tested.

**Benchmark Overview**

The provided JSON represents a JavaScript microbenchmarking test case on MeasureThat.net. The test aims to compare the performance of three different approaches: `Array.push()`, `Array.unshift()`, and using array spread syntax (`arr = [42, ...arr]`).

**Options Compared**

We're comparing the following options:

1. **`Array.push()`**: This is a simple way to add an element to the end of an array.
2. **`Array.unshift()`**: This method adds an element to the beginning of an array.
3. **Using array spread syntax (`arr = [42, ...arr]`)**: This syntax creates a new array by concatenating the original array with a new array containing the specified elements.

**Pros and Cons**

*   **`Array.push()`**:
    *   Pros: Simple to use, widely supported.
    *   Cons: Can be slower than other methods for large arrays due to the overhead of concatenation operations.
*   **`Array.unshift()`**:
    *   Pros: More efficient than `push()` for small arrays because it doesn't require concatenation. It also avoids unnecessary reallocations when using sparse arrays.
    *   Cons: Less intuitive and less supported than `push()`.
*   **Using array spread syntax (`arr = [42, ...arr]`)**:
    *   Pros: Can be more efficient than `push()` for large arrays because it avoids the overhead of concatenation operations. It also works with sparse arrays.
    *   Cons: Less intuitive and less supported than other methods.

**Library Usage**

There is no explicit library usage in this benchmark, but we can infer that the array methods are part of the built-in JavaScript API.

**Special JS Features or Syntax**

None of the provided test cases use special JavaScript features or syntax. They're straightforward examples of basic array operations.

**Other Alternatives**

If you were to run a similar benchmark using alternative approaches, some options could include:

*   Using `Array.prototype.concat()` instead of spread syntax.
*   Using libraries like Lodash (`_.uniq`) for array manipulation.
*   Implementing custom array append or prepend functions in JavaScript.

For example, if we wanted to compare the performance of different methods for appending elements to an array, our benchmark could look like this:

```json
{
    "Name": "Array Append",
    "Description": null,
    "Script Preparation Code": "var arr = []",
    "Html Preparation Code": null,
    "Individual test cases": [
        {
            "Benchmark Definition": "arr.push(42)",
            "Test Name": ".push()"
        },
        {
            "Benchmark Definition": "arr.concat([42])",
            "Test Name": "concat()"
        },
        {
            "Benchmark Definition": "var newArr = [42]; arr = newArr;",
            "Test Name": "custom append"
        }
    ]
}
```

Keep in mind that the choice of alternative approaches would depend on the specific requirements and constraints of your benchmark.

Related benchmarks:

Array .push() vs .unshift() vs spread (version: 0)

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

Created: 4 years ago by: Guest

Jump to the latest result

.unshift()

.push()

Spread

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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