关于浏览器Object对象读写性能测试

首先先说一下测试环境deepin20 Chrome98浏览器空白网页控制台

先贴代码

let obj={}
let obj2={}
let max1=100
let max2=10000
let randomMax=10000
//构建单层的百万级对象
console.time()
for(let i=0;i<max1;i++){
  for(let j=0;j<max2;j++){
    obj[i+'|'+j]=j
  }
}
console.timeEnd()
//构建双层的100*10000级对象
console.time()
for(let i=0;i<max1;i++){
  for(let j=0;j<max2;j++){
    if(!obj2[i]){
      obj2[i]={}
    }
    obj2[i][j]=j
  }
}
console.timeEnd()
//生成随机访问的数字
console.time()
let key=[]
let key1=[]
let key2=[]
let a=0
for(let i=0;i<randomMax;i++){
  let k1=Math.floor(Math.random()*max1)
  let k2=Math.floor(Math.random()*max2)
  key.push(k1+'|'+k2)
  key1.push(k1)
  key2.push(k2)
  a+=k2
}
console.log(a)
console.timeEnd()
//测试单层访问时间
console.time()
a=0
for(let i=0;i<randomMax;i++){
  a+=obj[key[i]]
}
console.log(a)
console.timeEnd()
//测试双层访问时间
console.time()
a=0
for(let i=0;i<randomMax;i++){
  if(obj2[key1[i]]){
    a+=obj2[key1[i]][key2[i]]
  }
}
console.log(a)
console.timeEnd()

分两种一种是直接构建有百万个成员的对象，另一种是构建双层的100 * 10000 的对象。 同时逐步提高第一层的数量。 测试构建时间和读10000个随机数据的时间

实验结果如下

第一层数量	100	200	300	400	500
单层构建时间	713.075927734375 ms	1335.253173828125 ms	2276.5048828125 ms	3425.6396484375 ms	3147.028076171875 ms
双层层构建时间	36.10400390625 ms	59.66015625 ms	85.975830078125 ms	110.27685546875 ms	137.18896484375 ms
单层读时间	4.126953125 ms	4.7919921875 ms	5.06396484375 ms	4.6708984375 ms	5.316162109375 ms
双层读时间	1.72509765625 ms	1.847900390625 ms	1.9501953125 ms	2.044921875 ms	1.871826171875 ms

第一层数量	600	700	800	900	10000
单层构建时间	4911.22705078125 ms	5614.969970703125 ms	6131.504150390625 ms	超过1min不再统计
双层层构建时间	161.9482421875 ms	187.968994140625 ms	206.123291015625 ms	265.198974609375 ms	2636.92724609375 ms
单层读时间	5.09228515625 ms	5.265869140625 ms	5.567138671875 ms
双层读时间	2.006103515625 ms	1.9677734375 ms	2.18603515625 ms	2.06201171875 ms	3.5400390625 ms

从结果上讲在百万级数据这个等级下Object性能十分的差，到达9百万左右时，可能出问题了作者的程序直接卡死了，所以去除单层的统计之间进行双层的。双层的即使在10000*10000的情况下也运行良好，所以推荐超过百万数量级的使用双层的Object提高效率