nested-list-access.js

const createList = (length) =>
  [...new Array(length)].map((_, index) => ({id: (index + 1).toString() }))

const length = 10000
const items = createList(length).map(c => ({ ...c, inner: createList(length) }))
console.log(items)
const lastId = length.toString()
const itemId = lastId
const innerItemId = lastId

console.time("search")
const start1 = window.performance.now()
const itemIndex = items.findIndex(i => i.id === itemId)
const innerItemIndex = items[itemIndex].inner.findIndex(i => i.id === innerItemId)
const item1 = items[itemIndex].inner[innerItemIndex]
const end1 = window.performance.now()
console.log(item1)
console.timeEnd("search")
console.log(`Execution time: ${end1 - start1} ms`);


console.time('obj')
const start2 = window.performance.now()
const itemMap = {}
for (let i = 0; i < items.length; i++) {
  const item = items[i];
  itemMap[item.id] = item.inner
}
const item2 = itemMap[itemId].find(i => i.id === innerItemId)
const end2 = window.performance.now()
console.log(item2)
console.timeEnd('obj')
console.log(`Execution time: ${end2 - start2} ms`);

console.time("indexes")
const start3 = window.performance.now()
const item3 = items[length - 1].inner[length - 1]
const end3 = window.performance.now()
console.log(item3)
console.timeEnd("indexes")
console.log(`Execution time: ${end3 - start3} ms`);