jQuery offset() vs css()

Benchmark created on


Description

Testing whether it is faster to change an object's offset via .offset() or .css()

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<style>
    #container{
        position: relative;
    }
    #element{
        position: absolute;
    }
</style>
<div id="container">
<div id="element">
Lorem ipsum dolor sit amet
</div>
</div>

Setup

var el = $("#element");

Teardown


    el.removeAttr("style");
  

Test runner

Ready to run.

Testing in
TestOps/sec
.offset()
el.offset({top: 10, left: 30});
ready
.css()
el.css({top: '10px', left: '30px'});
ready
native
el[0].style['top'] = '10px';
el[0].style['left'] = '30px'
ready

Revisions

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