Data attribute vs.jQuery().data (v91)

Revision 91 of this benchmark created on

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div id="el"></div>
<script>
  var i = 0,
      $del = document.getElementById('el'),
      $el = $(el);
      $eld = $el[0];
</script>

Setup

$i=0;
    $el.empty();

Test runner

Ready to run.

Testing in
TestOps/sec
Data attribute
$i=$i+1;
$el.attr('data-key-' + i, 'val-' + i);
$el.attr("data-key-" + i);
ready
jQuery.fn.data
$i = $i + 1;
$el.data('key-' + i, 'val-' + i);
$el.data("key-" + i);
ready
get/set Attribute
$i = $i + 1;
$del.setAttribute('data-key-'+i, 'val-' + i)
$del.getAttribute('data-key-'+i)
ready
jquery get
$i = $i + 1;
$eld.setAttribute('data-key-'+i, 'val-' + i)
$eld.getAttribute('data-key-'+i)
ready

Revisions

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