DOM element attribute retrievement speed

JavaScript performance comparison

Revision 2 of this test case created by Daniel Kocsan

Preparation code

<div id="myElement" data-foo="bar"></div
      
<script>
Benchmark.prototype.setup = function() {
  var obj = {
    foo: 'bar'
  },
  element = document.getElementById('myElement');

};

Benchmark.prototype.teardown = function() {
  obj = null;

};
</script>

Preparation code output

<div id="myElement" data-foo="bar"></div

Test runner

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

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
DOM attribute
(function () {
  var element = document.getElementById('myElement'),
      a = element.getAttribute('data-foo');
}());
pending…
Object property
(function () {
  var a = obj.foo;
}());
pending…
Cached DOM attribute
(function () {
  var a = element.getAttribute('data-foo');
}());
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.

0 Comments

window._gaq=[['_setAccount','UA-6065217-40'],['_trackPageview']]; (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.src='https://ssl.google-analytics.com/ga.js';s.parentNode.insertBefore(g,s)}(document,'script'))