Benchmark: Push vs Concat - MeasureThat.net

Script Preparation code:

var ar = [];
var ar2 = [];
for (var i = 0; i < 10 * 1000; i++) {
  ar[i] = i;
  ar2[i] = i;
}

Tests:

Push
for (var i = 0, len = ar2.length; i < len; i++) { ar.push(ar2[i]); }
Concat
ar = ar.concat(ar2);

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Push
Concat

Fastest: N/A

Slowest: N/A

Latest run results:

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

User agent: Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/117.0.0.0 Safari/537.36

Browser/OS: Chrome 117 on Android

View result in a separate tab

Test name	Executions per second
Push	204.7 Ops/sec
Concat	14.0 Ops/sec

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

LLMs can make mistakes. Check important info.

I'll break down the benchmark and explain what's being tested, compared, and the pros/cons of different approaches.

**Benchmark Overview**

The benchmark compares two ways to add elements to an array in JavaScript: `Array.prototype.push` and `Array.prototype.concat`. The test creates two arrays, `ar` and `ar2`, and populates them with 10 million elements each. It then runs the two benchmarks:

1. **Push**: Iterates over the length of `ar2` and pushes each element from `ar2` onto `ar`.
2. **Concat**: Creates a new array by concatenating `ar` and `ar2`.

**Library Used**

The test uses `Array.prototype.push` and `Array.prototype.concat`, which are built-in methods in JavaScript.

**Test Case Considerations**

The choice between `push` and `concat` depends on the use case. Here's a brief analysis of each approach:

* **Push**: This method is generally faster because it modifies the existing array, reducing the overhead of creating a new array.
* **Concat**: This method creates a new array, which can be slower due to the additional memory allocation and copying of elements.

Pros of `push`:

* Faster performance
* Modifies the original array

Cons of `push`:

* May not preserve the original order if the array is already full or has been modified.
* Can be less efficient when working with large arrays, as it can lead to a lot of garbage collection.

Pros of `concat`:

* Preserves the original order and size of both arrays.
* Can be more efficient for smaller arrays or when working with immutable data structures.

Cons of `concat`: Slower performance compared to `push`.

**Special JavaScript Features**

There are no special JavaScript features mentioned in this benchmark. However, it's worth noting that some modern browsers may optimize certain methods, such as `Array.prototype.push`, due to their widespread usage and the possibility of reducing garbage collection.

**Alternatives**

If you were to create a new benchmark, you might consider adding additional test cases, such as:

* Using `Array.prototype.splice` instead of `push`
* Using `Array.prototype.reduce()` or `Array.prototype.forEach()` instead of `concat`
* Comparing performance using different types of arrays (e.g., `Uint8Array`, `Int32Array`)
* Considering the impact of array length on performance

Keep in mind that benchmarking JavaScript performance can be complex, as it depends on various factors like browser version, engine, and platform. The results may vary depending on your specific use case and environment.

**Benchmark Preparation Code Analysis**

The script preparation code creates two empty arrays `ar` and `ar2`, then populates them with 10 million elements each using a `for` loop. This is a simple and efficient way to create large arrays for benchmarking purposes.

The HTML preparation code is not provided, but it's assumed that the browser renders some HTML content in the background during the benchmark, which may impact performance due to DOM manipulation, event handling, or other overheads.

Overall, this benchmark provides a useful comparison of two common array operations in JavaScript, highlighting the trade-offs between `push` and `concat`.

Related benchmarks:

Push vs Concat (version: 0)

Has Array.prototype.push more perf than Array.prototype.concat?

Comparing performance of: Push vs Concat

Created: 8 years ago by: Guest

Jump to the latest result

Push

Concat

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