jquery css chain vs array

Benchmark created on

Preparation HTML

<ul>
<li>Line 1</li>
<li>Line 2</li>
<li>Line 3</li>
</ul>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Setup

var $li = $('ul li');

Test runner

Ready to run.

Testing in
TestOps/sec
Chaining
$li
  .css('background', '#00ff00')
  .css('position', 'relative')
  .css('left', '30px');
ready
Array
$li.css({
  background: '#00ff00',
  position: 'relative',
  left: '30px'
});
ready
Array (quoted)
$li.css({
  'background': '#00ff00',
  'position': 'relative',
  'left': '30px'
});
ready

Revisions

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