Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
Spread operator vs Array.prototype.apply vs Array.prototype.concat
(version: 0)
Benchmark.js
Comparing performance of:
Spread operator vs Array.push.apply vs concat
Created:
2 years ago
by:
Guest
Go to the latest result
HTML Preparation code:
<div>Demo</div>
Script Preparation code:
console.log('js prep');
Tests:
Spread operator
var a = [1, 2,5 ,3, 44, 6, 7, 8, ,9, 10, 11, 12, 13]; var b = [14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24]; var c = [...a, ...b];
Array.push.apply
var a = [1, 2,5 ,3, 44, 6, 7, 8, ,9, 10, 11, 12, 13]; var b = [14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24]; var c = a.push.apply(a, b)
concat
var a = [1, 2,5 ,3, 44, 6, 7, 8, ,9, 10, 11, 12, 13]; var b = [14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24]; var c = a.concat(b);
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (3)
Previous results
Fork
Test case name
Result
Spread operator
Array.push.apply
concat
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/121.0.0.0 Safari/537.36
Browser/OS:
Chrome 121 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=511214" width="100%" height="500px"></iframe>
Array.push.apply
27.9M/s
concat
8.7M/s
Spread operator
1.9M/s
View exact numbers
Test name
Executions per second
✓
Array.push.apply
27,890,914 Ops/sec
concat
8,721,913 Ops/sec
Spread operator
1,878,251 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. **Benchmark Definition** The benchmark compares three different methods to concatenate two arrays: the spread operator (`...`), `Array.prototype.apply()`, and `Array.prototype.concat()`. **Options Compared** 1. **Spread Operator**: Using the spread operator (`...`) to concatenate two arrays. 2. **`Array.prototype.push.apply()`**: Using the `push()` method of an array to add elements from another array. 3. **`Array.prototype.concat()`**: Using the `concat()` method of an array to add one or more arrays. **Pros and Cons** * **Spread Operator**: + Pros: concise, efficient, and modern syntax. + Cons: may not be supported in older browsers or environments, can lead to slower performance due to string concatenation. * **`Array.prototype.push.apply()`**: Pros: widely supported across all browsers, can be faster than spread operator for large arrays. Cons: less readable, more complex syntax, and can lead to errors if not used correctly. * **`Array.prototype.concat()`**: Pros: widely supported, efficient, and easy to read. Cons: slightly slower than `push.apply()`, may require additional array creation. **Library and Syntax** The benchmark does not use any external libraries or specific JavaScript features. The syntax used is standard ECMAScript 2015 (ES6) syntax for the spread operator and modern array methods. **Considerations** * When working with large arrays, the spread operator might be slower than `push.apply()` due to string concatenation. * For most use cases, `Array.prototype.concat()` is a good choice, but it may require additional array creation. * The benchmark highlights the importance of considering the trade-offs between conciseness, readability, and performance when choosing an array method. **Alternatives** Other alternatives for concatenating arrays include: 1. **`Array.prototype.reduce()`**: Using `reduce()` to concatenate two arrays by accumulating elements in a new array. 2. **`Array.prototype.forEach()`**: Using `forEach()` to iterate over the first array, push each element to a new array, and then return the new array. Keep in mind that these alternatives may not be as efficient or readable as the methods compared in this benchmark.
Related benchmarks
concat 2 arrays: Array.prototype.concat vs spread operator
Array.prototype.concat vs spread operator (new try)
Array.prototype.concat vs spread operator (fix)
Array.prototype.concat vs spread operator real
Comments
Confirm delete:
Do you really want to delete benchmark?