Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
Feature Requests
FAQ
Register
Log In
Array vs Iterators
(version: 0)
Benchmark.js
Comparing performance of:
array methods vs iterators
Created:
2 years ago
by:
Guest
Go to the latest result
Script Preparation code:
var numbers = Array.from({length: 5}, (v, i) => i)
Tests:
array methods
numbers .map(x => x+1) .map(x => x*2) .map(x => x-1) .map(x => x/2) .forEach(console.log)
iterators
function * map(mapperFn, iterable) { for (const item of iterable) { yield mapperFn(item); } } numbers = map(x => x+1, numbers); numbers = map(x => x*2, numbers); numbers = map(x => x-1, numbers); numbers = map(x => x/2, numbers); for (const item of numbers) { console.log(item); }
Rendered benchmark preparation results:
Suite status:
<idle, ready to run>
Run tests (2)
Previous results
Fork
Test case name
Result
array methods
iterators
Fastest:
N/A
Slowest:
N/A
Latest run results:
Run details:
(Test run date:
2 years ago
)
User agent:
Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:109.0) Gecko/20100101 Firefox/113.0
Browser/OS:
Firefox 113 on Ubuntu
View result in a separate tab
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=489356" width="100%" height="500px"></iframe>
iterators
395K/s
array methods
13K/s
View exact numbers
Test name
Executions per second
✓
iterators
394,602 Ops/sec
array methods
13,218 Ops/sec
Autogenerated LLM Summary
(model
llama3.2:3b
, generated one year ago):
**What is being tested?** MeasureThat.net is testing the performance of two approaches to process an array of numbers: using traditional array methods (e.g., `map()`, `forEach()`) versus using iterators. The test case "Array vs Iterators" compares the execution time and memory usage of both approaches when performing a series of operations on an array of 5 numbers generated by `Array.from()`. **Options compared** 1. **Traditional Array Methods**: The first option uses traditional array methods, such as: * `map()`: applies a callback function to each element in the array. * `forEach()`: executes a callback function for each element in the array. * These methods create new arrays or objects in memory, which can be expensive. 2. **Iterators**: The second option uses iterators, specifically: * A generator function (`function * map(mapperFn, iterable) {...}`): creates an iterator that yields values from the input iterable. * The `for...of` loop: iterates over the yielded values. **Pros and Cons of each approach** 1. **Traditional Array Methods**: * Pros: + Easy to understand and implement for developers familiar with array methods. + Can be more intuitive for simple transformations. * Cons: + Creates new arrays or objects in memory, which can lead to increased memory usage. + May be slower due to the overhead of creating and manipulating new data structures. 2. **Iterators**: * Pros: + More efficient memory usage, as only necessary values are stored in memory. + Can reduce garbage collection overhead, leading to faster performance. * Cons: + Requires understanding of iterators and generator functions. + May be more complex to implement and debug. **Library** The `function * map(mapperFn, iterable)` code uses a custom iterator library or a polyfill for the `yield` keyword, which is not part of the standard JavaScript language. This allows the iterator function to yield values from the input iterable. **Special JS feature or syntax** No special features or syntax are used in this benchmark. It only relies on standard JavaScript language features and iterators. **Other alternatives** If you want to explore alternative approaches, here are a few options: 1. **Using `Promise.all()`**: Instead of using `map()` and `forEach()`, you could use `Promise.all()` to process the array elements in parallel. 2. **Using `reduce()`**: You could also use `reduce()` to perform aggregations on the array elements, instead of using `map()` and `forEach()`. 3. **Using Web Workers**: For large datasets or performance-critical applications, you might consider using Web Workers to offload the processing work to a separate thread. Keep in mind that each alternative approach has its own trade-offs and may not be suitable for all use cases.
Related benchmarks
Array slice.forEach vs for loop
array.prototype.at() vs array[array.length - 1]
`array.slice(-1)[0]` vs `array[array.length - 1]`
Array(length).fill() vs Array.from({ length: length })
Comments
Confirm delete:
Do you really want to delete benchmark?