JS Array vs Object performance

Readme.md

JS Array vs Object performance

The intention of this code is to have some personal persistance and point of view comparing JS objects and arrays mapping some values for its later search.

Recently (2021-09-01) is very common that people try to use a "fancy" way to compound structures when not in all scenarios could the most performant. Usage of find, map, reduce and is good use them when it merits, but on other cases, organize the data based on an Object by keys can increase the performance.

Here is another point of view and probably if the intention is just iterate could make sense this approach.

arrayVsObjectPick.js

const faker = require('faker');

let a = [];
let b = [];
const o = {};
let toPick = [];
const size = 10000;
const percentageToPick = size * 0.1;

console.log("Array of Objects with Reduce")
console.time('aReduce');
for (let t = 0; t < size; t++) {
  const name = `${faker.name.lastName()} ${faker.name.firstName()}`;
  const age = faker.datatype.number({ max: 100 })
  const pick = faker.datatype.number({ max: size })
  if (pick < percentageToPick) toPick.push(name);

  a[t] = { name, age };
}
console.log(toPick.map((name)=>a.reduce((it, el)=>{
  if(el.name === name) it.push(el.age)
  return it
}, [])).length);
console.timeEnd('aReduce');

console.log("Array of Objects with Find/Map")
a = []
toPick = []
console.time('aFind');
for (let t = 0; t < size; t++) {
  const name = `${faker.name.lastName()} ${faker.name.firstName()}`;
  const age = faker.datatype.number({ max: 100 })
  const pick = faker.datatype.number({ max: size })
  if (pick < percentageToPick) toPick.push(name);

  a[t] = { name, age };
}
console.log(toPick.map((name)=>a.find(el=> el.name === name)).map(el=>el.age).length);
console.timeEnd('aFind');

console.log("Array of Arrays with Reduce")
toPick = []
console.time('bReduce');
for (let t = 0; t < size; t++) {
  const name = `${faker.name.lastName()} ${faker.name.firstName()}`;
  const age = faker.datatype.number({ max: 100 })
  const pick = faker.datatype.number({ max: size })
  if (pick < percentageToPick) toPick.push(name);

  b[t] = [name,age]
}
console.log(toPick.map((name)=>b.reduce((it, el)=>{
  if(el[0] === name) it.push(el[1])
  return it
}, [])).length);
console.timeEnd('bReduce');

console.log("Array of Arrays with Find/Map")
b = []
toPick = []
console.time('bFind');
for (let t = 0; t < size; t++) {
  const name = `${faker.name.lastName()} ${faker.name.firstName()}`;
  const age = faker.datatype.number({ max: 100 })
  const pick = faker.datatype.number({ max: size })
  if (pick < percentageToPick) toPick.push(name);

  b[t] = [name,age]
}
console.log(toPick.map((name)=>b.find(el=> el[0] === name)).map(el=>el[1]).length);
console.timeEnd('bFind');

console.log("Object by Key")
toPick = []
console.time('o');
for (let t = 0; t < size; t++) {
  const name = `${faker.name.lastName()} ${faker.name.firstName()}`;
  const age = faker.datatype.number({ max: 100 })
  const pick = faker.datatype.number({ max: size })
  if (pick < percentageToPick) toPick.push(name);

  o[name] = age;
}
console.log(toPick.map(name=>o[name]).length);
console.timeEnd('o');

Results.md

Results 1

Array of Objects with Reduce 1056 aReduce: 203.826ms Array of Objects with Find/Map 997 aFind: 85.393ms Array of Arrays with Reduce 1002 bReduce: 170.49ms Array of Arrays with Find/Map 1030 bFind: 86.059ms Object by Key 918 o: 13.778ms

Results 2

Array of Objects with Reduce 1024 aReduce: 181.186ms Array of Objects with Find/Map 1021 aFind: 76.748ms Array of Arrays with Reduce 1004 bReduce: 193.42ms Array of Arrays with Find/Map 979 bFind: 100.303ms Object by Key 980 o: 15.821ms

Results 3

Array of Objects with Reduce 977 aReduce: 173.383ms Array of Objects with Find/Map 975 aFind: 81.491ms Array of Arrays with Reduce 1017 bReduce: 175.762ms Array of Arrays with Find/Map 996 bFind: 94.94ms Object by Key 1005 o: 15.744ms