jsPerf.app is an online JavaScript performance benchmark test runner & jsperf.com mirror. It is a complete rewrite in homage to the once excellent jsperf.com now with hopefully a more modern & maintainable codebase.

jsperf.com URLs are mirrored at the same path, e.g:

https://jsperf.com/negative-modulo/2

Can be accessed at:

https://jsperf.app/negative-modulo/2

appendChild vs. DocumentFragment vs. innerHTML (v14)

Revision 14 of this benchmark created on September 5, 2011

Description

Comparing three different ways to dynamically insert content into the DOM.

Preparation HTML

<div id="test"></div>
<script>
  var o = document.getElementById('test');
  var aElms = [text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr'), text(document.createElement('b'), 'Links:'), document.createTextNode(' '), text(document.createElement('a'), 'Link A'), document.createTextNode(' | '), text(document.createElement('a'), 'Link B'), document.createTextNode(' | '), text(document.createElement('a'), 'Link C'), document.createElement('hr')];
  var oFrag = document.createDocumentFragment();
  
  for (var i = 0, imax = aElms.length; i < imax; i++) {
   oFrag.appendChild(aElms[i]);
  }
  
  function text(node, txt) {
   node.appendChild(document.createTextNode(txt));
   return node;
  }
</script>

Test runner

Ready to run.

Test Ops/sec

appendChild

Testing in
Test	Ops/sec
appendChild	`o.innerHTML = ''; for (var i = 0, imax = aElms.length; i < imax; i++) { o.appendChild(aElms[i].cloneNode(true)); }`	ready
DocumentFragment	`o.innerHTML = ''; o.appendChild(oFrag.cloneNode(true));`	ready
innerHTML	o.innerHTML = '<b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr><b>Links:</b> <a>Link A</a> \| <a>Link B</a> \| <a>Link C</a><hr>';	ready

o.innerHTML = '';
for (var i = 0, imax = aElms.length; i < imax; i++) {
 o.appendChild(aElms[i].cloneNode(true));
}

ready

DocumentFragment

o.innerHTML = '';
o.appendChild(oFrag.cloneNode(true));

ready

innerHTML

o.innerHTML = '<b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr><b>Links:</b> <a>Link A</a> | <a>Link B</a> | <a>Link C</a><hr>';

ready

Revisions

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

Revision 1: published by Tom Doan on February 13, 2011
Revision 3: published on March 24, 2011
Revision 4: published by Premasagar Rose on March 30, 2011
Revision 5: published by Dominik Porada on May 25, 2011
Revision 6: published on June 6, 2011
Revision 7: published by Dominik Porada on June 7, 2011
Revision 8: published on July 12, 2011
Revision 9: published by chris bodar on July 22, 2011
Revision 10: published by chris bodar on July 22, 2011
Revision 11: published by chris bodar on July 22, 2011
Revision 12: published on July 26, 2011
Revision 14: published on September 5, 2011
Revision 15: published on May 8, 2012
Revision 18: published on February 14, 2013
Revision 19: published by Chris Khoo on February 28, 2013
Revision 20: published by Anirudh on March 21, 2013
Revision 21: published on March 26, 2013
Revision 22: published on March 26, 2013
Revision 23: published on April 22, 2013
Revision 24: published on May 20, 2013
Revision 25: published on July 9, 2013
Revision 26: published on July 9, 2013
Revision 27: published on July 16, 2013
Revision 28: published on July 25, 2013
Revision 29: published by utyf on July 26, 2013
Revision 30: published on July 26, 2013
Revision 31: published by utyf on July 26, 2013
Revision 32: published on July 28, 2013
Revision 33: published on August 2, 2013
Revision 34: published by David on August 14, 2013
Revision 35: published by bunicu on August 14, 2013
Revision 36: published by bunicu on August 14, 2013
Revision 37: published on August 26, 2013
Revision 38: published on August 28, 2013
Revision 39: published on September 24, 2013
Revision 41: published by Oliver Pulges on October 7, 2013
Revision 42: published on October 7, 2013
Revision 43: published on October 12, 2013
Revision 44: published by tomByrer on November 8, 2013
Revision 45: published by Eric Rowell on November 12, 2013
Revision 46: published by Eric Rowell on November 12, 2013
Revision 47: published on November 20, 2013
Revision 48: published by Honnza on December 2, 2013
Revision 49: published on December 19, 2013
Revision 50: published on December 26, 2013
Revision 52: published on January 28, 2014
Revision 54: published on February 26, 2014
Revision 55: published on February 26, 2014
Revision 56: published on February 26, 2014
Revision 57: published on March 1, 2014
Revision 58: published on March 7, 2014
Revision 59: published on May 10, 2014
Revision 60: published on May 19, 2014
Revision 61: published on June 12, 2014
Revision 62: published on August 16, 2014
Revision 64: published on October 10, 2014
Revision 65: published on October 10, 2014