classname switching vs new element onfly

Benchmark created by NickPanov on

Preparation HTML

<div id="alpha" class="testObject"></div>

Setup

var alpha = document.getElementById('alpha');
    
    var beta = document.createElement("div");
    beta.className = 'beta';

Test runner

Ready to run.

Testing in
TestOps/sec
add class, remove class
alpha.className += 'taken';
alpha.className = alpha.className.replace('taken', '')
ready
add el, remove el
alpha.appendChild(beta);
alpha.removeChild(beta)
 
ready

Revisions

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

  • Revision 1: published by NickPanov on