Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
javascript concat vs spread operator vs push
(version: 0)
javascript concat vs spread operator vs push
Comparing performance of:
concat vs spread operator vs push
Created:
5 years ago
by:
Guest
Jump to the latest result
Tests:
concat
var existed = [ 1, 2, 3 ]; var params = [ "hello", true, 7 ]; var other = existed.concat(params);
spread operator
var existed = [ 1, 2, 3 ]; var params = [ "hello", true, 7 ]; var other = [ ...existed, ...params ];
push
var existed = [ 1, 2, 3 ]; var params = [ "hello", true, 7 ]; var other = existed.push(...params);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
concat
spread operator
push
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
8 months ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/138.0.0.0 Safari/537.36
Browser/OS:
Chrome 138 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=616536" width="100%" height="500px"></iframe>
Test name
Executions per second
concat
23105816.0 Ops/sec
spread operator
47582336.0 Ops/sec
push
79012560.0 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the provided benchmark and its results. **Benchmark Overview** The benchmark compares three different ways to concatenate an array in JavaScript: using the `concat()` method, the spread operator (`...`), and the `push()` method with the spread operator. The goal is to determine which approach performs best in terms of execution speed. **Options Compared** 1. **`concat()` method**: This is a traditional way to concatenate arrays in JavaScript. It creates a new array by copying elements from both arrays. 2. **Spread Operator (`...`)**: Introduced in ECMAScript 2015, this operator allows you to expand an array or object into individual elements. In the context of concatenation, it spreads the elements of one array and appends them to another. 3. **`push()` method with Spread Operator**: This approach uses the `push()` method to add elements to an array from a new source (e.g., another array). The spread operator (`...`) is used to provide the elements to be added. **Pros and Cons** * **`concat()` method**: + Pros: Simple, widely supported, and easy to understand. + Cons: Creates a new array, which can lead to increased memory usage. * **Spread Operator (`...`)**: + Pros: More concise and efficient than `concat()`, creates a new array with minimal overhead. + Cons: Less intuitive for beginners, requires knowledge of the spread operator syntax. * **`push()` method with Spread Operator**: + Pros: Similar to the spread operator approach but provides more control over insertion order. + Cons: Requires using both `push()` and the spread operator in a single statement. **Library/Function Used** None are explicitly mentioned in the provided benchmark definition or test cases. However, the use of modern JavaScript features like the spread operator (`...`) is an indication that the benchmark aims to assess performance on relatively recent browsers. **Special JS Features/Syntax** The only notable feature used in this benchmark is the spread operator (`...`), which was introduced in ECMAScript 2015. This syntax allows for more concise and expressive array manipulation, but it may not be supported by older browsers or JavaScript environments. **Alternatives** Other approaches to concatenate arrays include: * Using `Array.prototype.push()` with a loop: `existed.push(...params);` * Using `Array.prototype.concat()` with a loop (not shown in the provided benchmark definition) * Using other libraries or frameworks that provide optimized array concatenation methods (e.g., React's `concat` function) In conclusion, this benchmark aims to compare the performance of three different approaches to concatenate arrays in JavaScript: using the `concat()` method, the spread operator (`...`), and the `push()` method with the spread operator. The results suggest that the spread operator approach is likely the fastest, followed by the `concat()` method. However, the choice of approach ultimately depends on the specific use case, personal preference, and compatibility requirements.
Related benchmarks:
spread operator vs push Brian
spread operator vs push Brian2
Array.prototype.concat vs spread operator (add)
Array.prototype.concat vs spread operator (fix)
zk test spread vs push
Comments
Confirm delete:
Do you really want to delete benchmark?