Emptying a Node

JavaScript performance comparison

Test case created by

Preparation code

<div id="container"></div>
      
<script>
Benchmark.prototype.setup = function() {
  var container = document.getElementById('container');
  var markup = '<div class="someClass">someText</div>';
  /*
  for (var i = 0; i < 10; i++) {
    markup += markup;
  }
  */
  container.innerHTML = markup;
  // Force reflow and style calculation.
  container.firstChild.offsetWidth;

};
</script>

Preparation code output

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

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
innerHTML (empty string)
container.innerHTML = '';
// Force reflow and style calculation.
container.firstChild;
container.offsetWidth;
pending…
innerHTML (null)
container.innerHTML = null;
// Force reflow and style calculation.
container.firstChild;
container.offsetWidth;
pending…
firstChild
while (container.firstChild) {
  container.removeChild(container.firstChild);
}
// Force reflow and style calculation.
container.firstChild;
container.offsetWidth;
pending…
lastChild
while (container.lastChild) {
  container.removeChild(container.lastChild);
}
// Force reflow and style calculation.
container.firstChild;
container.offsetWidth;
pending…
firstChild (cached)
var firstChild;
while (firstChild = container.firstChild) {
  container.removeChild(firstChild);
}
// Force reflow and style calculation.
container.firstChild;
container.offsetWidth;
pending…
lastChild (cached)
var lastChild;
while (lastChild = container.lastChild) {
  container.removeChild(lastChild);
}
// Force reflow and style calculation.
container.firstChild;
container.offsetWidth;
pending…

Compare results of other browsers

Revisions

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

0 Comments