Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Array push vs spread operator
(version: 0)
Compare the new ES6 spread operator with the traditional push method
Comparing performance of:
Push vs Spread
Created:
6 years ago
by:
Guest
Jump to the latest result
Tests:
Push
var params = [ "hello", true, 7 ] var other = params.push(1);
Spread
var params = [ "hello", true, 7 ] var other = [...params, 1];
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
Push
Spread
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/134.0.0.0 Safari/537.36
Browser/OS:
Chrome 134 on Windows
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=596572" width="100%" height="500px"></iframe>
Test name
Executions per second
Push
71889272.0 Ops/sec
Spread
44123756.0 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's dive into the world of JavaScript microbenchmarks! **What is tested?** The provided JSON represents a benchmark test case that compares two approaches to add an element to an array: the traditional `push()` method and the new ES6 spread operator (`...`). The test case measures which approach is faster in terms of executions per second. **Options compared** There are only two options being compared: 1. **Traditional push() method**: This is the classic way to add an element to an array using the `push()` method. 2. **New ES6 spread operator (`...`)**: This is a new syntax introduced in ECMAScript 2015 (ES6) that allows for more concise and expressive array creation. **Pros and Cons of each approach** 1. **Traditional push() method** * Pros: + Wide browser support (has been around since JavaScript 1.0) + Well-established and widely understood syntax * Cons: + Can be slower due to the overhead of calling a method on an array 2. **New ES6 spread operator (`...`)** * Pros: + More concise and expressive syntax, making it easier to create arrays + Potential performance benefits due to optimized JavaScript engines * Cons: + Newer syntax may take time for some browsers to fully support **Library used** None, this test case only uses built-in JavaScript features. **Special JS feature or syntax** The ES6 spread operator (`...`) is a relatively new syntax introduced in ECMAScript 2015 (ES6). It allows for more concise and expressive array creation by spreading elements of an existing array into a new array. **Benchmark preparation code** There is no provided script preparation code, but the test cases themselves demonstrate how to use both approaches: ```javascript // Traditional push() var params = [ "hello", true, 7 ]; var other = params.push(1); // New ES6 spread operator var params = [ "hello", true, 7 ]; var other = [...params, 1]; ``` **Other alternatives** There may be other ways to add an element to an array, such as using `concat()` or creating a new array with `Array.prototype.slice()`. However, these approaches are not being compared in this benchmark test case. Overall, this benchmark test case provides a simple and straightforward way to compare the performance of two different array manipulation methods: traditional `push()` vs. new ES6 spread operator (`...`).
Related benchmarks:
Array.prototype.slice vs spread operator 123
Array.prototype.slice vs spread operator with length limit
Array.prototype.slice vs spread operator for number only array
Array.prototype.slice vs spread operator With slightly bigger array
Array.prototype.slice vs spread operator on a bigger array
Comments
Confirm delete:
Do you really want to delete benchmark?