Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
concat vs push spread
(version: 0)
Comparing performance of:
concat vs spread and push vs push concatted
Created:
5 years ago
by:
Guest
Jump to the latest result
Tests:
concat
let operationModes = [1,2,3,4,5,6,7,8,9] let campaigns = [1,2,3,4,5,6,7,8,9,4,5,6,1] let result = []; result = result.concat(operationModes).concat(campaigns);
spread and push
let operationModes = [1,2,3,4,5,6,7,8,9] let campaigns = [1,2,3,4,5,6,7,8,9,4,5,6,1] let result = []; result.push(...operationModes); result.push(...campaigns);
push concatted
let operationModes = [1,2,3,4,5,6,7,8,9] let campaigns = [1,2,3,4,5,6,7,8,9,4,5,6,1] let result = []; result.push(...operationModes.concat(campaigns));
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
concat
spread and push
push concatted
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):
The provided benchmark compares three different approaches to concatenate arrays in JavaScript: 1. **Concatenation using `concat()`**: This method uses the `concat()` function to merge two or more arrays into one. ```javascript result = result.concat(operationModes).concat(campaigns); ``` Pros: * Well-supported by most browsers and JavaScript engines. * Can be used with any array type, including empty arrays. Cons: * Can create a new array object every time it's called, which can lead to performance issues for large datasets or when called repeatedly in rapid succession. 2. **Spreading using `...`**: This method uses the spread operator (`...`) to merge two or more arrays into one. ```javascript result.push(...operationModes); result.push(...campaigns); ``` Pros: * More efficient than `concat()` because it avoids creating a new array object every time. * Works with ES6+ compliant browsers and JavaScript engines, including modern versions of Chrome. Cons: * Not supported by older browsers or JavaScript engines that don't support the spread operator. The performance difference is relatively small for most use cases, but it's still worth considering when targeting legacy browsers. 3. **Concating using `push()` followed by `concat()`**: This method uses `push()` to add elements to an array and then calls `concat()` on the resulting array. ```javascript result.push(...operationModes.concat(campaigns)); ``` Pros: * Similar efficiency benefits as spreading, since `push()` and `concat()` are both optimized operations. Cons: * May not be as performant as directly using the spread operator due to the overhead of calling `concat()`, even though it's a built-in method. Other considerations: * When working with very large datasets or performance-critical code, using spreading (`...`) might be preferred for its efficiency benefits. * However, when targeting older browsers that don't support the spread operator, concatenation using `concat()` might be necessary to ensure compatibility. * Modern JavaScript engines, such as V8 in Chrome, have optimized various array operations, including these three approaches. The provided benchmark results show that spreading (`...`) is currently the fastest approach, followed by concating using `push()` and then `concat()`, and lastly concatenation using `concat()` alone.
Related benchmarks:
Array concat vs spread operator vs push #3
spread operator vs push Brian
spread operator vs push Brian2
Array concat vs spread operator vs push larger list
zk test spread vs push
Comments
Confirm delete:
Do you really want to delete benchmark?