Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
array update push vs spread vs concat
(version: 0)
Comparing performance of:
push vs spread vs concat
Created:
5 years ago
by:
Guest
Jump to the latest result
Script Preparation code:
var array = [].fill(0, 10, 100) var array2 = [].fill(0, 20, 100)
Tests:
push
array.push(...array2)
spread
array = [...array, ...array2]
concat
array = array.concat(array2)
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
push
spread
concat
Fastest:
N/A
Slowest:
N/A
Latest run results:
No previous run results
This benchmark does not have any results yet. Be the first one
to run it!
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's dive into the world of JavaScript microbenchmarks. **Benchmark Overview** The benchmark is designed to compare three different ways to append an array `array2` to another array `array`. The three methods being compared are: 1. Using `push()` with spread syntax (`...`) 2. Using spread syntax (`[...array, ...array2]`) 3. Using the `concat()` method **What is tested** The benchmark measures the performance of each method on a large array (10 elements) and its equivalent larger array (20 elements). The test cases are designed to capture the overhead introduced by each method. **Options compared** * **Push with spread syntax**: This method uses the spread operator (`...`) to create a new array by concatenating `array` and `array2`. It's a concise way to append elements to an array. + Pros: Easy to read, concise, efficient. + Cons: May incur additional overhead due to the creation of a new array object. * **Spread syntax**: This method uses the spread operator (`[...array, ...array2]`) to create a new array by concatenating `array` and `array2`. It's a more explicit way to append elements to an array. + Pros: More control over the resulting array, efficient. + Cons: May be less readable than the push with spread syntax method. * **Concat()**: This method uses the `concat()` method to concatenate `array` and `array2`. It's a traditional way to merge arrays. + Pros: Well-established, easy to understand. + Cons: May incur additional overhead due to the creation of new array objects. **Library** None. No external libraries are used in this benchmark. **Special JS feature/syntax** None mentioned in this benchmark. However, note that spread syntax (`...`) is a relatively recent addition to JavaScript (introduced in ES6) and may not be supported by older browsers or environments. **Other alternatives** In addition to these three methods, other ways to append elements to an array include: * Using `Array.prototype.push.apply()` * Using `Array.prototype.splice()` * Using `Array.prototype.unshift()` followed by `Array.prototype.slice()` These alternatives may have varying levels of performance and readability compared to the three methods being tested. **Benchmark preparation code** The benchmark preparation code creates two arrays, one with 10 elements and another with 20 elements, using `Array.prototype.fill()`: ```javascript var array = [].fill(0, 10, 100) var array2 = [].fill(0, 20, 100) ``` This code prepares the input data for the benchmark tests. **Individual test cases** Each test case measures the execution time of a specific method: * **Push with spread syntax**: `array.push(...array2)` * **Spread syntax**: `array = [...array, ...array2]` * **Concat()**: `array = array.concat(array2)` These test cases capture the performance differences between each method.
Related benchmarks:
Array push vs spread vs concat
Spread vs Push to Same Array v1
array update push vs spread
Javascript: Spread vs push
Comments
Confirm delete:
Do you really want to delete benchmark?