Benchmark: Array.find vs. Map.get 300

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);
array_large = getArray(100);

map_small = arrayToMap(array_small);
map_large = arrayToMap(array_large);

Tests:

Array.find, 3elements
const target = getRandomInt(2); array_small.find(el => el.id === target);
Map.get, 3 elements
const target = getRandomInt(2); map_small.get(target);
Array.find, 100 elements
const target = getRandomInt(99); array_large.find(el => el.id === target);
Map.get, 100 elements
const target = getRandomInt(999); map_large.get(target)

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
Array.find, 3elements
Map.get, 3 elements
Array.find, 100 elements
Map.get, 100 elements

Fastest: N/A

Slowest: N/A

Latest run results:

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

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

Browser/OS: Chrome 138 on Mac OS X 10.15.7

View result in a separate tab

Test name	Executions per second
Array.find, 3elements	67271224.0 Ops/sec
Map.get, 3 elements	127138496.0 Ops/sec
Array.find, 100 elements	16255125.0 Ops/sec
Map.get, 100 elements	125761496.0 Ops/sec

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

LLMs can make mistakes. Check important info.

Let's break down the benchmark and explain what's being tested.

**Benchmark Overview**

The benchmark compares the performance of two methods: `Array.find()` and `Map.get()`. The test measures the execution time of these methods on different arrays, specifically small (3 elements) and large (100 elements).

**Options Compared**

There are three main options compared:

1. **`Array.find()`**: This method returns the first element in an array that satisfies a provided testing function.
2. **`Map.get()`**: This method returns the value associated with the specified key from a map.
3. **Conversion from Array to Map**: The test also measures the performance of converting an array to a map using the `arrayToMap()` function.

**Pros and Cons**

Here are some pros and cons of each approach:

*   **`Array.find()`**:
    *   Pros: Simple, straightforward implementation, easy to understand.
    *   Cons: May be slower than `Map.get()` for large datasets because it needs to search through the entire array.
*   **`Map.get()`**:
    *   Pros: Efficient, as map lookups are typically O(1) operations.
    *   Cons: Requires a map data structure, which may not be necessary or efficient for small arrays.
*   **Conversion from Array to Map**:
    *   Pros: Can take advantage of map's efficient lookup times.
    *   Cons: May incur additional overhead due to the conversion process.

**Library and Special JS Features**

The test uses a custom `arrayToMap()` function, which converts an array to a map. This library is used to create maps from arrays, allowing for efficient lookups using `Map.get()`. No special JavaScript features are required or mentioned in this benchmark.

**Other Considerations**

When choosing between these approaches, consider the following factors:

*   Data structure: If you're working with large datasets, a map may be more efficient. For small arrays, `Array.find()` might suffice.
*   Complexity: The conversion from array to map adds complexity and potential overhead. Weigh this against the benefits of using a map for lookups.

**Alternatives**

If you're looking for alternative approaches or optimizations:

*   **`Map.from()`**: Instead of converting an array to a map, consider using `Map.from()`, which creates a new map from an iterable (in this case, an array).
*   **Caching**: If you need to perform these lookups frequently, consider caching the results in a smaller data structure, like a `Set` or `Map`.

In summary, the benchmark provides insight into the performance differences between `Array.find()`, `Map.get()`, and converting arrays to maps. By understanding the pros and cons of each approach, you can make informed decisions about which method best suits your specific use case.

Related benchmarks:

Array.find vs. Map.get 300 (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, 3elements vs Map.get, 3 elements vs Array.find, 100 elements vs Map.get, 100 elements

Created: one year ago by: Guest

Jump to the latest result

Array.find, 3elements

Map.get, 3 elements

Array.find, 100 elements

Map.get, 100 elements

Suite status: <idle, ready to run>

Fastest: N/A

Slowest: N/A

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