Run results for: Node Tree vs Direct Access

Run details:

User agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.5005.61 Safari/537.36

Browser: Chrome 102

Operating system: Linux

Device Platform: Desktop

Date tested: 2 years ago

Test name	Executions per second
Node Tree	398024.2 Ops/sec
Direct Access	11334766.0 Ops/sec

Script Preparation code:

function mapNodeTree(tree) {
  let index = 0;
  const result = {};
  const walk = (node) => {
    result[index++] = node;
    node.childNodes.forEach(walk);
  };
  walk(tree);
  return result;
}

var t = document.createElement('template');
t.innerHTML = '<tr><td class="col-md-1"></td><td class="col-md-4"><a></a></td><td class="col-md-1"><a><span class="glyphicon glyphicon-remove" aria-hidden="true" /></a></td><td class="col-md-6" /></tr>';
var template = t.content.firstChild;

Tests:

Node Tree
var tree = mapNodeTree(template) var node = tree[5];
Direct Access
var node = template.firstChild.nextSibling.nextSibling.firstChild