Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
Array.prototype.concat vs spread operator (new try)
(version: 0)
Benchmark.js
Compare the new ES6 spread operator with the traditional concat() method
Comparing performance of:
Array.prototype.concat vs spread operator
Created:
4 years ago
by:
Guest
Go to the latest result
Tests:
Array.prototype.concat
var array = [ 1, 2 ]; var other = [ ...array, 3 ];
spread operator
var array = [ 1, 2 ]; var other = array.concat(3);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Array.prototype.concat
spread operator
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
29 days ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/150.0.0.0 Safari/537.36 Edg/150.0.0.0
Browser/OS:
Chrome 150 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=633761" width="100%" height="500px"></iframe>
Array.prototype.concat
48.6M/s
spread operator
9.8M/s
View exact numbers
Test name
Executions per second
✓
Array.prototype.concat
48,551,184 Ops/sec
spread operator
9,782,199 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and explain what's being tested, compared, and other considerations. **What's being tested?** The benchmark is comparing two approaches to concatenate arrays in JavaScript: 1. The traditional `Array.prototype.concat()` method 2. The new ES6 spread operator (`...`) **Options compared:** * `Array.prototype.concat()`: This method takes one or more arrays as arguments and returns a new array that contains all the elements of the input arrays. * Spread operator (`...`): This operator allows you to expand an array into its constituent elements, which can then be used in various contexts. **Pros and Cons:** * `Array.prototype.concat()`: Pros: + Well-established and widely supported method + Easy to understand and use for simple concatenations * Cons: + Can be slower than the spread operator for large arrays due to its overhead + May have performance implications in certain scenarios (e.g., when used with large arrays or as a loop variable) * Spread operator (`...`): + Pros: - Faster than `concat()` for large arrays - More concise and expressive syntax + Cons: - May be less familiar to older developers or those not well-versed in ES6 features **Library and purpose:** None mentioned in the provided benchmark definition, but it's worth noting that neither `Array.prototype.concat()` nor the spread operator relies on any external libraries. **Special JS feature/syntax:** The use of the spread operator (`...`) is a notable example of a newer JavaScript feature. The spread operator is an ES6 syntax that was introduced to simplify array manipulation and other contexts where arrays are used as values or arguments. **Other alternatives:** Before the spread operator became widely adopted, developers often used various methods for concatenating arrays, such as: * `Array.prototype.push()`: Adding elements to the end of an array using `push()` instead of `concat()`. * `Array.prototype.splice()`: Using `splice()` to remove and replace elements within an array. * Manual string or array concatenation using loops or iteration. These alternatives are still valid approaches but may have different performance characteristics, readability, and maintainability compared to the spread operator and traditional `concat()` method.
Related benchmarks
concat 2 arrays: Array.prototype.concat vs spread operator
Array.prototype.concat vs spread operator on large array
Array.prototype.concat vs spread operator on small array
Comments
Confirm delete:
Do you really want to delete benchmark?