Benchmark: map foreach vs array lookup vs map const of vs arr const of

Script Preparation code:

var arr = [];
var map = new Map();

for (let i = 0; i < 12000; i++) {
  const num = i * 7 + Math.ceil(Math.random() * 5); 
  const str = (Math.random() + 1).toString(36).substring(7);
  arr.push(num);
  map.set(num, str);
}

Tests:

arr to map lookup
for (let i = 0;i < arr.length; i++) { let num = arr[i]; let str = map.get(num) || ''; }
map foreach
map.forEach((el)=>{})
map const of
for (const str of map) { let str32 = str[1]}
arr const of
for (const str of arr) { let str32 = str}

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
arr to map lookup
map foreach
map const of
arr const of

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 3 years ago)

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:92.0) Gecko/20100101 Firefox/92.0

Browser/OS: Firefox 92 on Windows

View result in a separate tab

Test name	Executions per second
arr to map lookup	2781.0 Ops/sec
map foreach	13184.6 Ops/sec
map const of	5397.9 Ops/sec
arr const of	17832.9 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the provided benchmark definition and test cases.

**Benchmark Definition**

The benchmark measures the performance of three different approaches for iterating over arrays and Maps in JavaScript:

1. `array.length` indexing (arr to map lookup)
2. `map.forEach()` method
3. Array destructuring (`const [str] = array`) with a Map

Each approach is tested on a large dataset of 12,000 elements.

**Options Compared**

The benchmark compares the performance of three different approaches:

1. **Array indexing**: Using `array.length` to access each element in the array and then looking up the corresponding value in the map using `map.get()`.
2. **`forEach()` method**: Iterating over the array using the `forEach()` method, which calls a callback function for each element.
3. **Array destructuring**: Accessing each element in the array using array destructuring syntax (`const [str] = array`) and then accessing the corresponding value in the map.

**Pros and Cons of Each Approach**

1. **Array indexing (arr to map lookup)**:
	* Pros: Simple, straightforward approach.
	* Cons: May be slower than other approaches due to the overhead of looking up values in a Map.
2. **`forEach()` method**:
	* Pros: More flexible than array indexing, as it allows for more complex iteration logic.
	* Cons: May be slower than array indexing or array destructuring due to the overhead of the `forEach()` method.
3. **Array destructuring (map const of)**:
	* Pros: Fast and efficient approach that directly accesses the desired values from the map.
	* Cons: Requires knowledge of array destructuring syntax, which may not be familiar to all developers.

**Library Used**

The benchmark uses the `Map` data structure from JavaScript's built-in API. The `Map` data structure is a collection of key-value pairs, where each key is unique and maps to a specific value.

**Special JS Feature or Syntax**

Array destructuring syntax (`const [str] = array`) is used in two of the test cases (map const of and arr const of). This feature allows developers to access multiple values from an array simultaneously using a single declaration.

**Other Alternatives**

If you're interested in exploring other alternatives, here are a few options:

1. **`for...of` loop**: Instead of using `forEach()`, you could use a traditional `for...of` loop to iterate over the array.
2. **`Array.prototype.map()`**: You could also use the `map()` method to create a new array with transformed values, instead of accessing individual elements in the original array.

These alternatives might not necessarily change the outcome of the benchmark, but they can provide additional insights into the performance characteristics of different iteration approaches.

Related benchmarks:

map foreach vs array lookup vs map const of vs arr const of (version: 0)

Comparing performance of: arr to map lookup vs map foreach vs map const of vs arr const of

Created: 3 years ago by: Guest

Jump to the latest result

arr to map lookup

map foreach

map const of

arr const of

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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