Toggle navigation
MeasureThat
.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Run results for:
Traverse function vs NodeIterator vs TreeWalker1
Let's compare the speed of 3 different ways to traverse the DOM.
Go to the benchmark
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=593287" width="100%" height="500px"></iframe>
Run details:
User agent:
Mozilla/5.0 (X11; Linux x86_64; rv:134.0) Gecko/20100101 Firefox/134.0
Browser:
Firefox 134
Operating system:
Linux
Device Platform:
Desktop
Date tested:
one year ago
XPATH
7K/s
createTreeWalker
1K/s
View exact numbers
Test name
Executions per second
✓
XPATH
6,977 Ops/sec
createTreeWalker
1,383 Ops/sec
Script Preparation code:
// language=HTML const html = ` <!-- article out start --> <article> <!-- article in start --> <h1>Lorem ipsum</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, nostrum.</p> <!-- article in end --> </article> <!-- article out end --> <!-- article out start --> <article> <!-- article in start --> <h1>Lorem ipsum</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, nostrum.</p> <!-- article in end --> </article> <!-- article out end --> <!-- article out start --> <article> <!-- article in start --> <h1>Lorem ipsum</h1> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, nostrum.</p> <!-- article in end --> </article> <!-- article out end --> `; const template = document.createElement('template'); template.innerHTML = html; window.testTemplate = template;
Tests:
createTreeWalker
var html = document.querySelector('html'); var walker = document.createTreeWalker(html, NodeFilter.SHOW_ALL); var node; while (node = walker.nextNode()) { console.log(node); }
XPATH
var vv = 'count'; var data = {count:1}; var xpat = document.evaluate(`//*[contains(translate(text(),' ', ''), "{{${vv}}}") or contains(translate(@value,' ', ''), "{{${vv}}}")]`, document, null, XPathResult.ANY_TYPE, null); while(node = xpat.iterateNext()){ console.log(node); }