display:none VS class hidden

Benchmark created on

Preparation HTML

<style>
.hidden { display:none; }
</style>
<p id="p">Algo</p>
<p id="p2" class="algo">Algo con class</p>

Setup

var oP = document.getElementById('p');
    var oP2 = document.getElementById('p2');

Test runner

Ready to run.

Testing in
TestOps/sec
Display:none
oP.style.display = 'none';
ready
Class Hidden
oP.className = 'hidden';
ready
Class Hidden + other class
oP2.className =+ ' hidden';
ready

Revisions

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