Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
foreach vs mappp
(version: 0)
Compare loop performance
Comparing performance of:
map vs foreach
Created:
2 years ago
by:
Guest
Go to the latest result
Script Preparation code:
var array = new Array(100000);
Tests:
map
array.map(function(i) { return { id: array[i] }; });
foreach
array.forEach(function(i) { const a = { id: array[i] }; });
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
map
foreach
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 years ago
)
User agent:
Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/123.0.0.0 Mobile Safari/537.36
Browser/OS:
Chrome Mobile 123 on Android
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=517497" width="100%" height="500px"></iframe>
foreach
5K/s
map
2K/s
View exact numbers
Test name
Executions per second
✓
foreach
5,213 Ops/sec
map
2,038 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
Let's dive into the world of JavaScript microbenchmarks on MeasureThat.net. **What is being tested?** The benchmark compares the performance of two loop constructs: `forEach` and `map`. Specifically, it tests how each construct creates an object with a single property, `tid`, which contains the corresponding value from the original array. **Options compared** There are two options being compared: 1. **`forEach`**: The `forEach` loop is used to iterate over the elements of the array and create an object with the desired properties. 2. **`map`**: The `map` method is used to create a new array by applying a function to each element of the original array. **Pros and Cons** * **`forEach`**: + Pros: Can be more intuitive for simple loop logic, easier to understand for those familiar with traditional loops. + Cons: May incur overhead due to the iteration and index management (e.g., `i` variable), which can affect performance in some cases. * **`map`**: + Pros: Creates a new array, which can be beneficial for parallel processing or other scenarios where you need to reuse the resulting data. Also, it's often faster than traditional loops since it's optimized by the browser engine. + Cons: May have higher overhead due to the creation of a new array, and it requires understanding the mapping function and its potential side effects. **Library and purpose** There is no external library used in this benchmark. The `forEach` and `map` methods are built-in JavaScript functions that are part of the standard library. **Special JS feature or syntax** The benchmark uses ES6+ syntax for both loops, including arrow functions (`=>`) and template literals (`\r\n`). These features are widely supported by modern browsers and are a natural fit for this type of performance comparison. **Other alternatives** For those interested in exploring alternative loop constructs, here are some options: * **Traditional `for` loop**: A simple and straightforward loop construct that's easy to understand but may incur more overhead than `forEach` or `map`. * **`reduce()` method**: While not a traditional loop, the `reduce()` method can be used to iterate over an array and accumulate values. It might offer better performance in certain scenarios. Keep in mind that these alternatives are less commonly used for simple loops like this benchmark, so it's unlikely you'll encounter them frequently in everyday JavaScript development.
Related benchmarks
map vs forEach Chris v2b
Array loop vs foreach vs map fixed by bomi
Array fill map, vs for i loop
Comments
Confirm delete:
Do you really want to delete benchmark?