many-classes-to-single-element-performance

JavaScript performance comparison

Test case created by Finchalyzer

Preparation code

<div id="without-classes"></div>
<div id="with-classes" class="hover green blue mixed effect level worried drop alert branch account spoon obnoxious dreary gratis successful chess dry squash check cure knee electric destroy introduce average decide fluttering bells wonderful drain plant celery spare berry recognise wilderness gray juicy grieving repulsive redundant fear whispering month coil mundane rake bare price ceaseless action lettuce one second bruise truthful doll petite stay mourn chubby back coach guide astonishing needy mother faithful cumbersome icicle gainful supply mighty grate irritating abusive strange rod heal">
    

Preparation code output

<div id="without-classes"></div> <div id="with-classes" class="hover green blue mixed effect level worried drop alert branch account spoon obnoxious dreary gratis successful chess dry squash check cure knee electric destroy introduce average decide fluttering bells wonderful drain plant celery spare berry recognise wilderness gray juicy grieving repulsive redundant fear whispering month coil mundane rake bare price ceaseless action lettuce one second bruise truthful doll petite stay mourn chubby back coach guide astonishing needy mother faithful cumbersome icicle gainful supply mighty grate irritating abusive strange rod heal">

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
Element with one class
var element = document.getElementById("without-classes")
element.classList.toggle("test-class")
pending…
Element with many classes
var element = document.getElementById("with-classes")
element.classList.toggle("test-class")
pending…

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

0 Comments