Class vs. Style (v13)

Revision 13 of this benchmark created by Dan on

Description

(TEST ON MOBILE DEVICES) Dom css manipulation

Preparation HTML

<style>
  .one { width: 100px; }
</style>
<div id="candidate">
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>

Setup

var candidate = document.getElementById('candidate');
    var $candidate = $(document.getElementById('candidate'));

Teardown


    $(candidate).removeClass('one')

Test runner

Ready to run.

Testing in
TestOps/sec
js.Class (className)
candidate.className = 'one';
ready
js.Class (setAttribute)
candidate.setAttribute('class', 'one');
ready
js.Style
candidate.style.width = '100px';
ready
js.Style (setAttribute)
candidate.setAttribute('style', 'width: 100px;');
ready
jq.CSS(stlye attr)
$candidate.css("width", "100px");
ready
jq.attr(style attr)
$candidate.attr("style", "width:100px");
ready

Revisions

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