Benchmark: Array.find vs. Map.get fork23

Script Preparation code:

function getRandomElement(id) {
  return {
    id,
    a: Math.random(),
    b: Math.random(),
    c: Math.random(),
  }
}

function getArray(length) {
  const result = [];
  for (let i = 0; i < length; i++) {
    result.push(getRandomElement({i}))
  }
  
  return result;
}

function arrayToMap(array) {
  return new Map(array.map(el => [el.id, el]));
}

function getRandomInt(max) {
  return Math.floor(Math.random() * max);
}

array_small = getArray(3);

small_idxs = array_small.map(o => o.id);

array_large = getArray(10);

large_idxs = array_large.map(o => o.id);

map_small = arrayToMap(array_small);
map_large = arrayToMap(array_large);

Tests:

Array.find, 10 000 elements
const target = small_idxs[getRandomInt(2)]; array_small.find(el => el.id === target);
Map.get, 10 000 elements
const target = small_idxs[getRandomInt(2)]; map_small.get(target);
Array.find, 1 000 000 elements
const target = large_idxs[getRandomInt(9)]; array_large.find(el => el.id === target);
Map.get, 1 000 000 elements
const target = large_idxs[getRandomInt(9)]; map_large.get(target)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.find, 10 000 elements
Map.get, 10 000 elements
Array.find, 1 000 000 elements
Map.get, 1 000 000 elements

Fastest: N/A

Slowest: N/A

Latest run results:

Run details: (Test run date: 10 months ago)

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/121.0.0.0 Safari/537.36

Browser/OS: Chrome 121 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Array.find, 10 000 elements	1259967.4 Ops/sec
Map.get, 10 000 elements	1285575.4 Ops/sec
Array.find, 1 000 000 elements	1260852.5 Ops/sec
Map.get, 1 000 000 elements	1353731.2 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 JSON and explain what's being tested.

**Overview**

The benchmark compares the performance of `Array.find()` vs. `Map.get()` in various scenarios, including different array sizes and conversion from arrays to maps. The goal is to determine which method is faster and more efficient.

**Options Compared**

1. **Array.find()**: A method that searches for a specific element in an array.
2. **Map.get()**: A method that retrieves the value associated with a given key (or index) in a map.

**Pros and Cons**

* **Array.find()**:
	+ Pros: Easy to use, straightforward syntax.
	+ Cons: Can be slow for large arrays, especially if the array is not indexed (e.g., when using `find()` on an unindexed array).
* **Map.get()**:
	+ Pros: Faster for large datasets, as it uses a hash table for fast lookups. Also, maps can store additional data associated with each key.
	+ Cons: More complex syntax, requires knowledge of map operations.

**Library Used**

In this benchmark, the `map()` function is used to convert arrays to maps (e.g., `arrayToMap(array)`). The `Map` object is a built-in JavaScript data structure that stores key-value pairs. It's implemented as a hash table, which allows for fast lookups and insertions.

**Special JS Feature**

None mentioned in the provided code snippet, but it's worth noting that some newer JavaScript versions (e.g., ECMAScript 2022) introduced features like `Map.prototype.get()` with a more concise syntax: `map.get(key)`.

**Benchmark Test Cases**

The benchmark consists of four test cases:

1. Small array (3 elements): Both `Array.find()` and `Map.get()` are tested with a small dataset to warm up the engines.
2. Small array (10,000 elements): The same as the previous case, but with a much larger dataset.
3. Large array (1,000,000 elements): Both methods are tested with an extremely large dataset to determine their performance under heavy load.

**Other Alternatives**

If `Array.find()` or `Map.get()` were not available, alternative solutions could be:

* For finding an element in an array: Using a custom loop or recursion.
* For fast lookups in an object (not map): Using a library like Lodash's `_.find()` or implementing a simple hash table.

However, these alternatives would likely introduce performance overhead compared to the optimized methods provided by JavaScript.

Related benchmarks:

Array.find vs. Map.get fork23 (version: 0)

Test the performance of Array.find vs. Map.get, with various array sizes, and with/without conversion from array to map

Comparing performance of: Array.find, 10 000 elements vs Map.get, 10 000 elements vs Array.find, 1 000 000 elements vs Map.get, 1 000 000 elements

Created: 10 months ago by: Guest

Jump to the latest result

Array.find, 10 000 elements

Map.get, 10 000 elements

Array.find, 1 000 000 elements

Map.get, 1 000 000 elements

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):