Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Array concat vs spread operator vs push vs new array spread
(version: 0)
Compare the new ES6 spread operator with the traditional concat() method and push
Comparing performance of:
Array.prototype.concat vs Push vs New array spread
Created:
5 years ago
by:
Guest
Jump to the latest result
Tests:
Array.prototype.concat
var params = [ "hello", true, 7 ]; var other = [ 1, 2 ] other = other.concat(params);
Push
var params = [ "hello", true, 7 ]; var other = [ 1, 2 ] other = other.push(...params);
New array spread
var params = [ "hello", true, 7 ] var other = [ 1, 2 ] var other = [ ...other, ...params ]
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
Array.prototype.concat
Push
New array spread
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
gemma2:9b
, generated one year ago):
This benchmark compares three different methods of combining two arrays in JavaScript: * **`Array.prototype.concat`:** This is the traditional method for joining arrays, using the `concat()` function. * **Spread Operator (`...`)**: This ES6 feature allows you to expand the elements of an array directly into another array. * **`push()` method:** The `push()` method adds elements to the end of an existing array and returns the new length of the array. We're using it here with the spread operator to combine arrays. Let's break down the pros and cons: **Array.prototype.concat():** * **Pros:** Widely understood, reliable, works consistently across different JavaScript engines. * **Cons:** Can create a new array copy, potentially leading to memory overhead if you have very large arrays. **Spread Operator (`...`)**: * **Pros:** Concise syntax, often considered more readable than `concat()`, can be used in various contexts beyond array merging. * **Cons:** May not perform as efficiently as `push()` when dealing with very large arrays, as it might involve more copying operations internally. **`push()` Method + Spread Operator**: * **Pros:** Potentially the most efficient method, as it modifies the original array in-place instead of creating a new one. * **Cons:** Less versatile than `concat()` and spread operator; primarily designed for appending elements to an existing array. **Other Considerations:** * **Array Size:** For very small arrays, performance differences might be negligible. The choice becomes more significant with larger arrays due to potential memory implications. * **Code Clarity:** While the spread operator offers a compact syntax, `concat()` can sometimes be more readable for beginners or in situations where its behavior is more explicit. **Alternatives:** * **Library Methods:** Libraries like Lodash offer specialized functions for array manipulation that might provide optimized performance depending on your use case. * **Custom Functions:** You could write your own custom function to combine arrays based on specific requirements or optimization strategies. The benchmark results you provided show that the `push()` method with the spread operator is currently the fastest in this scenario, followed by the spread operator and then `concat()`. However, these results can vary depending on factors like browser versions, JavaScript engines, and hardware.
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?