querySelectorAll vs getElementsByTagName
JavaScript performance comparison
Preparation code
<div>
<ul>
<li><a href="#">item 1</a></li>
<li><a href="#">item 2</a></li>
<li><a href="#">item 3</a></li>
</ul>
</div>
Preparation code output
<div>
<ul>
<li><a href="#">item 1</a></li>
<li><a href="#">item 2</a></li>
<li><a href="#">item 3</a></li>
</ul>
</div>
Test runner
Warning! For accurate results, please disable Firebug before running the tests. (Why?)
Java applet disabled.
Test | Ops/sec | |
---|---|---|
querySelectorAll
|
|
pending… |
getElementsByTagName
|
|
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.
- Revision 1: published Andrew Hedges
- Revision 17: published
- Revision 20: published Jeff Larson
- Revision 21: published Sebastian Poreba
- Revision 22: published MONTILLET
- Revision 25: published
- Revision 26: published
- Revision 27: published Philip Tellis
- Revision 28: published Carl Letourneau
- Revision 29: published
- Revision 30: published Philip Tellis
- Revision 32: published
- Revision 33: published
- Revision 34: published
- Revision 35: published
- Revision 36: published
- Revision 37: published Derp
- Revision 38: published
- Revision 39: published
- Revision 40: published Zebulon84
- Revision 41: published Jim Montgomery
- Revision 42: published Jim Montgomery
- Revision 43: published
- Revision 44: published Jim Montgomery
- Revision 45: published
- Revision 46: published
- Revision 47: published
- Revision 48: published Adam
- Revision 50: published foob
- Revision 51: published foob
- Revision 54: published diego nunes
- Revision 55: published
- Revision 56: published
- Revision 58: published
- Revision 59: published
- Revision 61: published Oliver Clevont
- Revision 62: published
- Revision 63: published
- Revision 64: published
- Revision 65: published
- Revision 66: published
- Revision 67: published niklas
- Revision 69: published Dan
- Revision 70: published
- Revision 71: published jakschu
- Revision 74: published Dan
- Revision 75: published eicto
- Revision 76: published attr vs class
- Revision 77: published D4Tocchini
- Revision 79: published
- Revision 80: published
- Revision 81: published
- Revision 82: published
- Revision 83: published
- Revision 84: published my-password-is-password
- Revision 86: published
- Revision 87: published
- Revision 89: published
- Revision 90: published karthick
- Revision 91: published
- Revision 92: published Yaroslaff Fedin
- Revision 94: published
- Revision 95: published Yaroslaff Fedin
- Revision 96: published
- Revision 98: published
- Revision 99: published
- Revision 101: published
- Revision 103: published
- Revision 104: published
- Revision 105: published
- Revision 106: published
- Revision 107: published
- Revision 108: published
- Revision 110: published
- Revision 111: published Andy Herron
- Revision 115: published Brian Griffin
- Revision 117: published
- Revision 119: published
- Revision 120: published
- Revision 121: published
- Revision 124: published
- Revision 125: published
- Revision 126: published
- Revision 127: published
- Revision 128: published
- Revision 129: published
- Revision 130: published
- Revision 131: published
- Revision 132: published
- Revision 133: published
- Revision 134: published
- Revision 135: published
- Revision 136: published Thomas Drach
- Revision 137: published Tri
- Revision 138: published DM
- Revision 140: published alskdjf
- Revision 145: published
- Revision 146: published
- Revision 147: published
- Revision 148: published no name pls..
- Revision 149: published Adil Aliyev
- Revision 150: published TIK JUN
- Revision 151: published
- Revision 152: published Yaroslav
- Revision 154: published Andrei
- Revision 155: published Andrei
- Revision 156: published
- Revision 157: published
- Revision 158: published XFox Prower
- Revision 159: published Kasper Kronborg Isager
- Revision 161: published marek
- Revision 163: published Junliang Huang
- Revision 172: published
- Revision 177: published Scott Southworth
- Revision 178: published Daniel Johnson
5 Comments
Oh God...
I found the explanation here: http://www.nczonline.net/blog/2010/09/28/why-is-getelementsbytagname-faster-that-queryselectorall/
Wow, looks like Chrome 9.0.570 to 9.0.576 doubled its speed for
getElementsByTagName
. Nice! Love jsPerf!I think this test case needs to be updated - in a current scenario that I am working on, I have a very complex page (ASP.NET, SharePoint 2010 SP1, Master Page is involved) that contains cascading filters, and I must iterate through 4000-5000 divs. By using
querySelectorAll
I am able to get runtimes of about ~20-30ms while thegetElementByTagName
is executing in 200-300ms.querySelectorAll
: 20-30msgetElementByTagName
: 200-300msquerySelectorAll
: 5-10msgetElementByTagName
: 15-30msWhile the difference for Chrome can be argued, the performance in IE9 is significant.
Se test est débile, querySelectorAll sert a faire des requette complexe, pas a remplacer les méthodes déjà existante, il aurait fallut comparer des requette complexe avec querySelectorAll contre l'équivalent avec les ancienne méthode avec les boucle...