Benchmark: Array vs object literal v2

Script Preparation code:

function setup() {

  const randInt = (min, max) =>
      Math.floor(Math.random() * (max - min + 1) + min);

  const itemMap = {};
  const itemArr = [];

  for (let i = 0; i < 10000; i++) {
      const item = {
          id: randInt(0, 1000000),
          value: `value-${randInt(0, 1000000)}`
      };
      itemArr.push(item);
      itemMap[item.id] = item;
  }

  const itemIdsToGet = [itemArr[8002].id, itemArr[2423].id, itemArr[5322].id, itemArr[3].id, itemArr[7242].id]
  
  return {
    itemIdsToGet,
    itemMap,
    itemArr
  }
}

Tests:

map
const values = setup(); for (const itemIdToUpdate of values.itemIdsToGet) { values.itemMap[itemIdToUpdate].value = 'updated' }
array
const values = setup(); for (const itemIdToUpdate of values.itemIdsToGet) { const index = values.itemArr.findIndex(x => x.id === itemIdToUpdate); values.itemArr[index].value = 'updated'; }

Rendered benchmark preparation results:

Suite status: <idle, ready to run>

Previous results

Test case name	Result
map
array

Fastest: N/A

Slowest: N/A

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

LLMs can make mistakes. Check important info.

**Benchmark Overview**

MeasureThat.net is a website that allows users to create and run JavaScript microbenchmarks, comparing the performance of different approaches for various use cases.

The provided benchmark definition represents a test case where two methods are compared:

1. **Array Literal**: This method uses an array to store and update values.
2. **Object Literal (Map)**: This method uses an object literal (map) to store and update values.

**Options Compared**

The two options being compared are:

* `array`: The "array" option, which uses an array to store and update values. In this case, it finds the index of the item in the array using `findIndex()` and then updates the value at that index.
* `map`: The "map" option, which uses an object literal (map) to store and update values.

**Pros and Cons**

* **Array Literal (array)**:
	+ Pros: Simple and easy to understand. It's a common approach in JavaScript for iterating over arrays.
	+ Cons: May have performance overhead due to the use of `findIndex()` and array indexing, which can be slower than object literal (map) lookup.
* **Object Literal (Map)**:
	+ Pros: Fast and efficient, as it uses direct object property access. It's a good choice when you need to look up values by key.
	+ Cons: May require more memory, depending on the size of the map.

**Library Used**

In this benchmark, no libraries are explicitly mentioned, but the use of `findIndex()` and array indexing suggests that JavaScript's built-in Array methods are being used.

**Special JS Feature or Syntax**

There is no special JavaScript feature or syntax used in this benchmark. It's a straightforward implementation of two common approaches to updating values in arrays.

**Other Alternatives**

If you wanted to test other alternatives, here are some options:

* Using `forEach()` instead of `findIndex()` and array indexing
* Using a different data structure, such as a linked list or a trie
* Adding additional logic or overhead, such as caching or async operations

Note that the performance characteristics of these alternatives would depend on the specific use case and requirements.

Latest run results:

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

User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.99 Safari/537.36

Browser/OS: Chrome 97 on Windows

View result in a separate tab

Test name	Executions per second
map	177.5 Ops/sec
array	182.3 Ops/sec

Related benchmarks:

Array vs object literal v2 (version: 0)

Comparing performance of: map vs array

Created: 2 years ago by: Guest

Jump to the latest result

map

array

Suite status: <idle, ready to run>

Experimental features:

Fastest: N/A

Slowest: N/A

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