Benchmark: spread vs concat vs apply on large data set - 2

Tests:

array spread
const arr = [] for(i=0;i<10000;i++){ arr.push(i); } const arr2 = [1,2]; const newArray = [1,2,...arr]
array concat
const arr = [] for(i=0;i<10000;i++){ arr.push(i); } const arr2 = [1,2]; const newArray = arr2.concat(arr)
array push apply
const arr = [] for(i=0;i<10000;i++){ arr.push(i); } const arr2 = [1,2]; const newArray = arr2.push.apply(arr2, arr)
array spread in a push
const arr = [] for(i=0;i<10000;i++){ arr.push(i); } const arr2 = [1,2]; const newArray = arr2.push(...arr)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
array spread
array concat
array push apply
array spread in a push

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gemma2:9b, generated one month ago):

LLMs can make mistakes. Check important info.

This benchmark tests the performance of three different ways to combine arrays in JavaScript: the spread operator (`...`), the `concat()` method, and the `apply()` method with the `push()` function.

**Here's a breakdown:**

* **Test Cases:**

* **`array spread`:**  This test uses the spread operator (`...`) to combine the elements of a large array (`arr`) into another array (`arr2`).
    * **`array concat`:** This test uses the `concat()` method to combine the elements of `arr` into `arr2`. 
    * **`array push apply`:** This test uses the `apply()` method with the `push()` function to add all the elements of `arr` to the end of `arr2`.  
    * **`array spread in a push`:** This test combines the spread operator and `push()`. It spreads the elements of `arr` into `arr2`, effectively appending them.

**Pros and Cons:**

* **Spread Operator (`...`)**: 
    * **Pros:** Generally considered the most concise and readable option, especially for simple array combinations.  JavaScript optimizes it well.
    * **Cons:** Might not be as performant for very large arrays compared to `concat()` when used repeatedly.

* **`concat()` Method:**
    * **Pros:** Can be efficient for combining multiple arrays, potentially better performance than the spread operator for larger datasets. 
    * **Cons:**  Can create a new array object with each call.

* **`push.apply()`**:
    * **Pros:** Often used when you need to modify an existing array in place. It can be faster than `concat()` for very large arrays.
    * **Cons:** More complex syntax, less readable than the spread operator or `concat()`.

**Other Considerations:**

* **Array Size:**  The best method might depend on the size of your arrays. For small arrays, the differences in performance are likely negligible. For extremely large arrays, benchmarking with specific data sets is crucial.
* **Memory Usage:** While `concat()` creates a new array, the spread operator and `push.apply()` usually have less impact on memory usage.

* **Code Readability:** The spread operator (`...`) often leads to more readable code, making it a preferred choice in many scenarios.

**Alternatives:**
* Libraries like Lodash or Underscore provide optimized versions of array methods like `concat()`, which can sometimes offer better performance.  However, these libraries add extra dependencies to your project.

Latest run results:

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

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/110.0.0.0 Safari/537.36

Browser/OS: Chrome 110 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
array spread	12845.0 Ops/sec
array concat	23571.7 Ops/sec
array push apply	15224.2 Ops/sec
array spread in a push	15329.8 Ops/sec

Related benchmarks:

spread vs concat vs apply on large data set - 2 (version: 1)

Large data set is the difference

Comparing performance of: array spread vs array concat vs array push apply vs array spread in a push

Created: 6 years ago by: Registered User

Jump to the latest result

array spread

array concat

array push apply

array spread in a push

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

Autogenerated LLM Summary (model gemma2:9b, generated one month ago):