Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
concat vs spread test
(version: 0)
Comparing performance of:
concat vs spread
Created:
2 years ago
by:
Guest
Go to the latest result
Tests:
concat
const a = [1] const b = [1].concat([2],[3])
spread
const a = [1] const b = [...a, ...[2], ...[3]]
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
concat
spread
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 years ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36
Browser/OS:
Chrome 119 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=486869" width="100%" height="500px"></iframe>
spread
60.4M/s
concat
14.6M/s
View exact numbers
Test name
Executions per second
✓
spread
60,392,196 Ops/sec
concat
14,602,444 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the benchmark and explain what's being tested. **Benchmark Definition** The benchmark definition is a simple JavaScript code snippet that creates an array `a` with one element, 1, and then creates another array `b` using either the `concat()` method or the spread operator (`...`). The goal of this benchmark is to compare the performance of these two methods for concatenating arrays. **Options Being Compared** There are only two options being compared: 1. **Concatenation with `concat()`**: This approach uses the `concat()` method to merge arrays. It's a widely supported method in JavaScript, but it can be slower than other approaches. 2. **Concise Array Creation with Spread Operator (`...`)**: This approach uses the spread operator to create a new array by spreading elements from existing arrays. **Pros and Cons of Each Approach** * **Concatenation with `concat()`**: + Pros: Widely supported, easy to read and understand. + Cons: Can be slower due to method call overhead. * **Concise Array Creation with Spread Operator (`...`)**: + Pros: Fast, concise, and modern syntax. + Cons: May not be as widely supported in older browsers or environments. **Library/Functionality Used** In this benchmark, there is no specific library or function being tested. However, the use of the spread operator (`...`) indicates that the benchmark is targeting modern JavaScript environments (e.g., ECMAScript 2015+). **Special JS Feature/Syntax** The spread operator (`...`), also known as rest spread syntax, was introduced in ECMAScript 2015 (ES6). It allows for concise array creation by spreading elements from existing arrays. **Other Alternatives** For array concatenation, other approaches include: * Using `Array.prototype.push()` to add elements to the end of an array. * Creating a new array using `Array.from()` and passing an iterable or array as an argument. These alternatives may have different performance characteristics depending on the specific use case and environment. In summary, this benchmark compares the performance of two approaches for concatenating arrays in JavaScript: using the `concat()` method versus the concise array creation with the spread operator (`...`). The spread operator approach is generally faster but requires modern JavaScript environments.
Related benchmarks
Array.prototype.concat vs spread operator 12
concat vs spread three arrays
Comments
Confirm delete:
Do you really want to delete benchmark?