Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Array push vs map v1
(version: 0)
Compare the new ES6 spread operator with the traditional concat() method and push
Comparing performance of:
array.push vs array.map
Created:
7 years ago
by:
Registered User
Go to the latest result
Script Preparation code:
var a1 = [] var a2 = new Array(10).fill(null)
Tests:
array.push
for (let i = 0; i < 10; i++) { a1.push({ itemIndex: i }) }
array.map
a2.map((_, i) => ({ itemIndex: i }))
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
array.push
array.map
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
one year ago
)
User agent:
Mozilla/5.0 (X11; Linux x86_64; rv:133.0) Gecko/20100101 Firefox/133.0
Browser/OS:
Firefox 133 on Linux
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=577341" width="100%" height="500px"></iframe>
array.map
8.8M/s
array.push
1.0M/s
View exact numbers
Test name
Executions per second
✓
array.map
8,813,303 Ops/sec
array.push
1,022,316 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's break down the benchmark and its options. **Benchmark Overview** The benchmark is comparing two ways to add elements to an array: using the `push()` method versus the new ES6 spread operator (`...`) in combination with `map()`. The benchmark aims to determine which approach is faster. **Options Compared** There are only two options being compared: 1. **`array.push()`**: This is a traditional way of adding elements to an array by calling the `push()` method on each element individually. 2. **`array.map((_, i) => ({ itemIndex: i }))`**: This approach uses the spread operator (`...`) and `map()` to add elements to a new array. **Pros and Cons** * **`array.push()`**: + Pros: Simple, straightforward implementation. No additional libraries or complexity required. + Cons: May be slower due to individual push operations for each element. * **`array.map()`**: + Pros: Can handle larger arrays efficiently by batch-processing elements using `map()`. + Cons: Requires understanding of the spread operator (`...`) and potentially introduces unnecessary complexity. **Other Considerations** The benchmark also includes two pre-benchmark preparation steps: 1. Creating an empty array `a1` using `var a1 = []`. 2. Creating an array `a2` with 10 null elements using `new Array(10).fill(null)`. These steps are necessary to ensure the benchmark runs consistently and accurately. **Library Usage** There is no specific library mentioned in this benchmark, but it uses standard JavaScript features like `map()` and `push()`. **Special JS Feature/Syntax (None)** Since there's no special feature or syntax used in this benchmark, we can skip that part of the explanation. **Other Alternatives** If you're interested in exploring other alternatives, here are a few options: * Using `Array.prototype.slice()` to create a new array with elements added using `push()`. * Implementing a custom iterator-based approach for adding elements to an array. * Comparing performance with third-party libraries like Lodash or Ramda. Keep in mind that each of these alternatives would require additional setup and may introduce different complexity factors compared to the original benchmark.
Related benchmarks
Array.prototype.concat vs spread operator
Array.prototype.concat vs spread operator
concat 2 arrays: Array.prototype.concat vs spread operator
Concat vs Spread (Two Arrays)
Array concat vs spread operator vs push with more data
Comments
Confirm delete:
Do you really want to delete benchmark?