Basic DOM manipulation (v2)

Revision 2 of this benchmark created by Mathias Bynens on


Description

What’s the cost of writing to the DOM?

Preparation HTML

<div id="container"></div>

Setup

Benchmark.prototype.setup = function() {
   var div = document.createElement('div'),
       p = document.createElement('p'),
       el = document.getElementById('container');
   el.innerHTML = '';
  }

Test runner

Ready to run.

Testing in
TestOps/sec
Only one DOM write
div.appendChild(p);
el.appendChild(div);
ready
Two DOM writes
el.appendChild(div);
div.appendChild(p);
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.

  • Revision 1: published by Mathias Bynens on
  • Revision 2: published by Mathias Bynens on
  • Revision 4: published by Gabriel R. Giannattasio on