Run results for: Array vs object literal

Run details:

User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.15; rv:151.0) Gecko/20100101 Firefox/151.0

Browser: Firefox 151

Operating system: Mac OS X 10.15

Device Platform: Desktop

Date tested: 3 months ago

Benchmark engine: Benchmark.js

item array

368/s

Item map and enumerating values

186/s

View exact numbers

Test name	Executions per second
✓ item array	368 Ops/sec
Item map and enumerating values	186 Ops/sec

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:

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