Browser Diet - $(this).attr('id') vs. this.id

JavaScript performance comparison

Revision 11 of this test case created

Preparation code

<a id="a" class="tests" href="#">a</a>
<a id="b" class="tests" href="#">b</a>
<a id="c" class="tests" href="#">c</a>
<a id="d" class="tests" href="#">e</a>
<a id="f" class="tests" href="#">f</a>
<a id="g" class="tests" href="#">g</a>
<a id="h" class="tests" href="#">h</a>
<a id="i" class="tests" href="#">i</a>
<a id="j" class="tests" href="#">j</a>
<a id="k" class="tests" href="#">k</a>
<a id="l" class="tests" href="#">l</a>
<a id="m" class="tests" href="#">m</a>
<a id="n" class="tests" href="#">n</a>
<a id="o" class="tests" href="#">o</a>
<a id="p" class="tests" href="#">p</a>
<a id="q" class="tests" href="#">q</a>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script>
  $testList = $('.tests');
</script>

Preparation code output

a b c e f g h i j k l m n o p q

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
jQuery's .attr()
$testList.each(function() {
  x = $(this).attr('id');
});
pending…
Pure JavaScript
$testList.each(function() {
  x = this.id;
});
pending…
Pure JavaScript, Minus jQuery.each
len = $testList.length;
for (var i = 0; i < len; i++) {
  x = $testList.get(i).id;
}
pending…
Pure JavaScript, skip .get()
for (var i = 0; len = $testList.length; i < len; i++) {
  x = $testList[i].id;
}
pending…

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

0 comments

Add a comment