Benchmark: Javascript push vs Unshift vs Concat

Script Preparation code:

var arr1;
var arr2;

Tests:

Push
arr1 = [1, 2, 3]; arr2 = [4, 5, 6]; arr1.push(...arr2);
Unshift
arr1 = [1, 2, 3]; arr2 = [4, 5, 6]; arr2.unshift(...arr1);
Concat
arr1 = [1, 2, 3]; arr2 = [4, 5, 6]; arr1 = arr1.concat(arr2);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Push
Unshift
Concat

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/129.0.0.0 Safari/537.36

Browser/OS: Chrome 129 on Windows

View result in a separate tab

Test name	Executions per second
Push	3833300.2 Ops/sec
Unshift	3241629.0 Ops/sec
Concat	2485949.8 Ops/sec

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

LLMs can make mistakes. Check important info.

Measuring the performance of different JavaScript array methods can be an interesting and complex task.

The provided JSON represents a benchmark that tests the execution time of three different approaches: `push`, `unshift`, and `concat` when inserting one array into another.

**Approaches being compared:**

1.  **Push**: This method appends elements to the end of an array without modifying its length.
2.  **Unshift**: This method adds one or more elements to the beginning of an array without modifying its length.
3.  **Concat**: This method creates a new array by concatenating two or more arrays.

**Pros and Cons of each approach:**

*   **Push**:

*   Pros:
        *   Generally faster than `unshift` since it doesn't require shifting elements to make room for the new ones.
        *   More efficient when inserting multiple elements at the end of an array, as it only requires a single pass through the existing elements.
    *   Cons:
        *   May cause performance issues if used excessively or with large arrays, due to the need to reallocate memory and update indices.

*   **Unshift**:

*   Pros:
        *   More suitable for inserting elements at the beginning of an array when working with sparse arrays (arrays that have fewer elements than their maximum capacity).
        *   May be faster than `push` for certain edge cases where the array is already relatively full.
    *   Cons:
        *   Generally slower than `push`, especially when dealing with large arrays, due to the need to shift all existing elements down by one position after insertion.

*   **Concat**:

*   Pros:
        *   Creates a new array without modifying the original, making it safer for use in certain scenarios.
        *   Suitable for inserting elements into multiple arrays or when working with arrays that have complex internal structures.
    *   Cons:
        *   Generally slower than `push` and `unshift`, since creating a new array requires additional memory allocation and copying of existing elements.

**Library usage:**

None of the provided benchmark test cases explicitly use any external libraries. However, some benchmarks might include custom or third-party libraries to measure specific scenarios or edge cases not covered by the standard JavaScript methods.

**Special JS features or syntax:**

This benchmark does not explicitly utilize any special JavaScript features or syntax beyond the standard array methods being compared. If you're interested in measuring performance for more advanced topics like async/await, generators, or Web Workers, the Measuring That.net framework can be extended to accommodate those use cases as well.

**Alternatives and additional considerations:**

*   **Array.prototype.at()**: This is a relatively recent addition to JavaScript arrays that allows indexing into an array using a numeric position. Depending on your specific requirements, you might want to consider whether `at()` would be faster or more efficient than the methods tested in this benchmark.
*   **Native array methods and modern browsers**: With modern browser support for native array methods like `fill()`, `forEach()`, and others, it's worth investigating whether these can provide performance benefits over the standard array methods compared here.
*   **Array caching and optimization techniques**: Depending on your application's requirements and constraints, there might be specific caching or optimization strategies that could significantly impact performance when working with arrays.

Related benchmarks:

Javascript push vs Unshift vs Concat (version: 1)

Comparing performance of: Push vs Unshift vs Concat

Created: one year ago by: Registered User

Jump to the latest result

Push

Unshift

Concat

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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