Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Array concat vs spread operator vs push at the end
(version: 0)
Compare the new ES6 spread operator with the traditional concat() method and push
Comparing performance of:
Array.prototype.concat vs spread operator vs Push
Created:
3 years ago
by:
Guest
Jump to the latest result
Tests:
Array.prototype.concat
var params = [ "hello", true, 7 ]; var other = params.concat([ 1, 2 ]);
spread operator
var params = [ "hello", true, 7 ] var other = [ ...params, 1, 2 ]
Push
var params = [ "hello", true, 7 ]; var other = params.push(1, 2);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
Array.prototype.concat
spread operator
Push
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 explaining the provided JSON benchmark. **Benchmark Overview** The benchmark is designed to compare the performance of three different approaches to concatenate an array: `push()` at the end, the spread operator (`[...array, item]`), and the traditional `concat()` method. The goal is to determine which approach is the fastest on a Windows desktop device with Chrome 106. **Options Compared** 1. **Push()**: This involves pushing elements onto the array using `push(item)` and then returning the modified array. 2. **Spread Operator**: This uses the spread operator (`[...array, item]`) to create a new array by copying all elements from the original array and adding the new element(s). 3. **Concat()**: This involves calling the `concat()` method on an existing array or creating a new one using `[]` and then passing in another array to be concatenated. **Pros and Cons of Each Approach** 1. **Push()**: * Pros: Can be used with arrays that need to maintain their original length, as it modifies the original array. * Cons: Requires an additional operation (pushing elements) which might impact performance if done in a loop. 2. **Spread Operator**: * Pros: Creates a new array and doesn't modify the original, making it suitable for use with large arrays or when preserving the original data is crucial. * Cons: Can be less efficient than `concat()` due to the creation of an intermediate array (if using modern JavaScript engines). 3. **Concat()**: * Pros: Efficient as it creates a new array without modifying the original, and some older browsers might optimize this operation better. * Cons: May not work well with large arrays or when preserving the original data is crucial. **Other Considerations** When deciding between these approaches, consider the following factors: * Array size: For small arrays, `push()` and spread operator might be comparable. For larger arrays, `concat()` might be more efficient. * Performance requirements: If you need the fastest approach for large datasets or performance-critical code, `concat()` might be the better choice. **Library Usage** There are no libraries used in this benchmark. **Special JS Features/Syntax** None mentioned explicitly.
Related benchmarks:
Array.prototype.concat vs spread operator
concat 2 arrays: Array.prototype.concat vs spread operator
ES6 Array concat vs spread operator
Array concat vs spread operator vs push with more data
Array.prototype.concat vs spread operator real
Comments
Confirm delete:
Do you really want to delete benchmark?