Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
Array vs Map
(version: 0)
Benchmark.js
JS Array operation vs Map
Comparing performance of:
JS Array set vs JS Array map
Created:
2 years ago
by:
Guest
Go to the latest result
Tests:
JS Array set
const jsArray = Array.from({ length: 1000 }, (_, i) => ({ id: i, a: 1, b: 2, timeMs: 0, })); // * update jsArray timeMs with 1 jsArray.forEach((item) => (item.timeMs = 1));
JS Array map
const jsArray = Array.from({ length: 1000 }, (_, i) => ({ id: i, a: 1, b: 2, timeMs: 0, })); // * update jsArray timeMs with jsArray.map const jsArrayMap = jsArray.map((item) => ({ ...item, timeMs: 1 }));
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
JS Array set
JS Array map
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/119.0.0.0 Safari/537.36
Browser/OS:
Chrome 119 on Mac OS X 10.15.7
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=486964" width="100%" height="500px"></iframe>
JS Array set
33K/s
JS Array map
24K/s
View exact numbers
Test name
Executions per second
✓
JS Array set
32,849 Ops/sec
JS Array map
23,870 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?** MeasureThat.net is testing two different approaches for updating an array in JavaScript: using the `forEach` method and using the `map` method. The benchmark compares the performance of these two approaches on a large array with 1000 elements. **Options compared** There are two options being compared: 1. **Array.forEach**: This method updates each element in the array by iterating through it, which can be slow for large arrays. 2. **Array.map**: This method creates a new array with the updated values without modifying the original array, which is generally faster. **Pros and Cons** * **Array.forEach**: + Pros: Can update each element individually, potentially more efficient for small updates. + Cons: Iterates through the entire array, making it slower for large arrays. * **Array.map**: + Pros: Creates a new array with updated values without modifying the original array, making it faster for large arrays. + Cons: Can be memory-intensive if dealing with very large datasets. **Library and purpose** In this benchmark, no specific library is used. The benchmark focuses on native JavaScript methods. **Special JS feature or syntax** There are no special JavaScript features or syntax being tested in this benchmark. However, it's worth noting that the `map` method uses a more modern, concise syntax, which may be considered a minor optimization by some developers. **Other alternatives** Other approaches for updating an array could include: * Using a loop with an index variable (e.g., `for (var i = 0; i < arr.length; i++) { arr[i].timeMs = 1 }`) * Using the `reduce` method to update each element individually * Using a library like Lodash or Underscore.js, which provides utility functions for array operations Keep in mind that these alternatives may have different performance characteristics compared to the `forEach` and `map` methods. **Benchmark preparation code** The benchmark preparation code is minimal, as it only initializes an array of 1000 elements using `Array.from`. The `forEach` and `map` tests then update this array by setting a specific property (`timeMs`) to 1.
Related benchmarks
Array.prototype.map vs Lodash map
Slice vs Map (jv)
Array.from() vs new Array().map()
Array Spread vs Fill vs New Array
Comments
Confirm delete:
Do you really want to delete benchmark?