Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
push vs spread (reduce array)
(version: 0)
Comparing performance of:
spread vs push
Created:
2 years ago
by:
Guest
Jump to the latest result
Script Preparation code:
var data = [...Array.from(Array(10000).keys())]
Tests:
spread
data.reduce((acc, curr) => [...acc, curr],[])
push
data.reduce((acc, curr) => (acc.push(curr),acc),[])
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
spread
push
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
6 months ago
)
User agent:
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/142.0.0.0 Safari/537.36 Edg/142.0.0.0
Browser/OS:
Chrome 142 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
Test name
Executions per second
spread
44.1 Ops/sec
push
40310.7 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 measures the performance difference between two approaches: using the `push` method to add elements to an array, versus using the spread operator (`...`) with the `reduce` method. **Options Compared** Two options are compared: 1. **Push**: This approach uses the `push` method to add each element of the array to the end of the accumulator array. 2. **Spread**: This approach uses the spread operator (`...`) with the `reduce` method to create a new array by spreading the elements of the input array into the accumulator array. **Pros and Cons** * **Push**: Pros: + Simple and straightforward implementation + Works well for small arrays or performance-critical code * Cons: + Can be slower than other approaches, especially for large arrays, due to the overhead of pushing each element individually * **Spread**: Pros: + More concise and expressive syntax + Can be faster than push for large arrays, since it avoids the overhead of individual pushes * Cons: + May have additional overhead due to string slicing (if `Array.from()` is used) or object creation (for other spread implementations) + Less intuitive implementation for developers unfamiliar with array manipulation **Library** In this benchmark, `Array.from()` is used to create an array of numbers from 0 to 9,999. This library is a built-in JavaScript function that creates a new array by mapping over the input iterable. **Special JS Feature or Syntax** The use of `...` (spread operator) and `reduce()` is a modern JavaScript feature. The spread operator was introduced in ECMAScript 2015, and `reduce()` has been part of the language since ECMAScript 2009. **Other Considerations** * The benchmark uses a mobile Safari 16 browser, which may have different performance characteristics than desktop browsers. * The device platform (mobile) and operating system (iOS) can also impact performance. * The number of executions per second is used as a metric to compare the performance of the two approaches. **Other Alternatives** Some alternative approaches that could be tested in this benchmark include: * Using `concat()` instead of `push` * Using a custom implementation that avoids array manipulation * Testing different initial values for the accumulator array * Comparing the performance of different JavaScript engines or versions These alternatives would require additional modifications to the benchmark definition and script preparation code.
Related benchmarks:
Arrays: spread operator vs push
Array: spread operator vs push
Push to array, vs ES6 Spread.
array update push vs spread
spread vs ArrayFrom
Comments
Confirm delete:
Do you really want to delete benchmark?