Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Array concat vs spread operator vs push333
(version: 0)
Compare the new ES6 spread operator with the traditional concat() method and push
Comparing performance of:
Array.prototype.concat vs Push
Created:
6 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.push(...params);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Array.prototype.concat
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
gemma2:9b
, generated one year ago):
This benchmark on MeasureThat.net compares three different ways to append elements to an array in JavaScript: * **`Array.prototype.concat()`:** This is the traditional method for concatenating arrays. It creates a new array containing all the elements from the original array and the added elements. * **Spread Operator (`...`)**: Introduced in ES6, the spread operator allows you to expand an iterable (like an array) into its individual elements. In this benchmark, it's used with `push()` to add the new elements to the existing array. This approach modifies the original array directly. * **`Array.prototype.push()`:** This method adds one or more elements to the end of an existing array and returns the new length of the array. **Pros & Cons:** | Method | Pros | Cons | |---------|-------------------------------------------|--------------------------------------------| | concat()| - Returns a new array, preserving original. | - Creates a new array object, potentially less efficient for large arrays. | | Spread Operator + push() | - Modifies the original array in-place, potentially more memory efficient. | - Requires knowledge of ES6 spread operator syntax. | | push() | - Simple and straightforward | - Only adds elements to the end of an array. | **Other Considerations:** * **Performance:** The benchmark results show that `concat()` is significantly faster than using the spread operator with `push()`. This likely due to `concat()` being a more optimized operation within JavaScript engines. * **Use Case:** * Choose `concat()` when you need a new array without modifying the original. * Use `spread` + `push()` when modifying the existing array directly is acceptable and performance isn't critical. * Use `push()` for simple appending to the end of an array. **Alternatives:** * **Libraries:** While not specifically mentioned in this benchmark, JavaScript libraries like Lodash offer optimized functions (`_.concat`, `_.union`) for array manipulation that might be more efficient than vanilla JavaScript methods.
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?