Benchmark: Iterator/generator vs. forEach vs. for...of

Iterator/generator vs. forEach vs. for...of (version: 0)

Recurse through a nested data structure using iterator/generator vs. forEach vs. for...of

Comparing performance of: Generator populating a map via for...of vs Generator populating a map via Map.prototype.constructor vs recursively add to map using Array.prototype.forEach vs recursively add to map using for...of

Created: 3 years ago by: Registered User

Jump to the latest result

Script Preparation code:

var nodes = new Array(1000).fill(null).map((_, i) => ({
  id: i,
  nodes: new Array(100).fill(null).map((_, i2) => ({
    id: `${i}-${i2}`,
    nodes: new Array(10).fill(null).map((_, i3) => ({
      id: `${i}-${i2}-${i3}`,
    })),
  })),
}));

Tests:

Generator populating a map via for...of
function* iterateOverNodes(nodes) { for (const node of nodes) { yield [node.id, node]; if (node.nodes) { yield* iterateOverNodes(node.nodes); } } } var map = {}; for (const [id, node] of iterateOverNodes(nodes)) { map[id] = node; }
Generator populating a map via Map.prototype.constructor
function* iterateOverNodes(nodes) { for (const node of nodes) { yield [node.id, node]; if (node.nodes) { yield* iterateOverNodes(node.nodes); } } } var map = new Map(iterateOverNodes(nodes));
recursively add to map using Array.prototype.forEach
function addNodesToMap(nodes, map = {}) { nodes.forEach((n) => { map[n.id] = n; if (n.nodes) { addNodesToMap(n.nodes, map); } }); return map; } addNodesToMap(nodes);
recursively add to map using for...of
function addNodesToMap(nodes, map = {}) { for (const n of nodes) { map[n.id] = n; if (n.nodes) { addNodesToMap(n.nodes, map); } } return map; } addNodesToMap(nodes)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Generator populating a map via for...of
Generator populating a map via Map.prototype.constructor
recursively add to map using Array.prototype.forEach
recursively add to map using for...of

Fastest: N/A

Slowest: N/A

Latest run results:

No previous run results

This benchmark does not have any results yet. Be the first one to run it!

Autogenerated LLM Summary (model llama3.2:3b, generated one year ago):

LLMs can make mistakes. Check important info.

**Overview**

The provided JSON represents a benchmark test created using MeasureThat.net, which compares the performance of three approaches for recursing through a nested data structure to populate a map: generator-based iteration (`for...of`), Array prototype method (`forEach`), and a custom recursive function.

**Test Cases**

There are four individual test cases:

1. **Generator populating a map via for...of**: This test case uses a generator function (`function* iterateOverNodes`) to yield nodes in the nested structure, which is then iterated over using `for...of` to populate a map.
2. **Generator populating a map via Map.prototype.constructor**: Similar to the previous test case, but instead of using `for...of`, it uses the `Map.prototype.constructor` method to create a new map instance and pass the generator function's result to it.
3. **recursively add to map using Array.prototype.forEach**: This test case uses the `forEach` method on an array of nodes to populate a map, recursively traversing the nested structure.
4. **recursively add to map using for...of**: Similar to the previous test case, but instead of using `Array.prototype.forEach`, it uses `for...of` to iterate over the nodes in the nested structure.

**Options Compared**

The three approaches compared are:

* Generator-based iteration (`for...of`)
* Array prototype method (`forEach`)
* Custom recursive function

Each approach has its pros and cons:

* **Generator-based iteration (`for...of`)**:
	+ Pros: Can be more efficient for large datasets, as it avoids the overhead of creating a new array or map instance.
	+ Cons: May not work well with older browsers or versions that don't support generators.
* **Array prototype method (`forEach`)**:
	+ Pros: Widely supported across most browsers and versions, making it a good choice for compatibility reasons.
	+ Cons: Can be less efficient than generator-based iteration, as it creates an intermediate array of results.
* **Custom recursive function**:
	+ Pros: Offers fine-grained control over the recursion process, allowing for potential optimizations.
	+ Cons: Can be slower and more memory-intensive than other approaches due to the overhead of recursive calls.

**Other Considerations**

When choosing between these approaches, consider factors like:

* Browser support: If you need to target older browsers or versions, `Array.prototype.forEach` might be a better choice.
* Dataset size: For large datasets, generator-based iteration (`for...of`) might be more efficient.
* Performance-critical code: Custom recursive functions can offer optimizations, but may come at the cost of increased complexity and potential bugs.

**Additional Notes**

If test users enable special JavaScript features or syntax, they should be aware that:

* Generators are a relatively new feature introduced in ECMAScript 2015 (ES6), so older browsers might not support them.
* The `Map.prototype.constructor` method is also a newer feature and may not work in older browsers.

Overall, the choice of approach depends on the specific requirements and constraints of your project.

Related benchmarks: