Run results for: Testing JS Performance of deleting a large map.

In FF if the object being iterated over is large enough it will trigger an expensive cycle collection with Test #1. Test #2 runs approximately 100 times faster on FF. The difference is marginal in Chrome. To see the difference in timing, I recommend loading up the debugger console to see exactly how many ms each run takes.

Run details:

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

Browser: Chrome 69

Operating system: Windows

Device Platform: Desktop

Date tested: 5 years ago

Test name	Executions per second
The slow version	7.3 Ops/sec
Faster version using Object.keys().	9.9 Ops/sec

Script Preparation code:

var map = {};

function generateSequence(prefix, numItems) { 
  var buffer = [];
  var prefixInstance = prefix || "";
  for (var i = 0; i < numItems; i++) {
    buffer.push(prefix + i);
  }
  return buffer;
}

var startTime;
function startTimer() {
  startTime = new Date().getTime()
}
function stopTimer() {
  var endTime = new Date().getTime();
  console.log("Took " + (endTime - startTime) +  " ms");
}

function generateMap() {
  console.log("Generating");
  for (var i = 0; i < 50000; i++) {
	map["a-" + i] = { 
      a: generateSequence("aaaaaaaaa", 10)
    }
  }

}

Tests:

The slow version
generateMap(); console.log("Test #1"); startTimer(); for (key in map) { if (map.hasOwnProperty(key)) { delete map[key]; } } stopTimer();
Faster version using Object.keys().
generateMap(); console.log("Test #2"); startTimer(); var keys = Object.keys(map); for (var i = 0, ii = keys.length; i < ii; i++) { delete map[keys[i]]; } stopTimer();

Run results for: Testing JS Performance of deleting a large map.

The slow version

Faster version using Object.keys().