insertAdjacentHTML vs innerHTML vs appendChild

Benchmark created on

Preparation HTML

<div id="test"></div>

Setup

var node = document.getElementById("test"), span;

Test runner

Ready to run.

Testing in
TestOps/sec
innerHTML
node.innerHTML += '<span>test</span>';
ready
appendChild
span = document.createElement('span');
span.appendChild(document.createTextNode('test'));
ready
insertAdjacentHTML
node.insertAdjacentHTML('beforeend', '<span>test</span>');
ready

Revisions

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