Toggle navigation
MeasureThat.net
Create a benchmark
Tools
Feedback
FAQ
Register
Log In
Run results for:
form.elements vs querySelector for Submit button
Go to the benchmark
Embed
Embed Benchmark Result
<iframe src="https://measurethat.net/Embed?id=610283" width="100%" height="500px"></iframe>
Run details:
User agent:
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/136.0.0.0 Safari/537.36
Browser:
Chrome 136
Operating system:
Windows
Device Platform:
Desktop
Date tested:
10 months ago
Test name
Executions per second
form elements iteration
2656483.0 Ops/sec
querySelector
2877803.8 Ops/sec
HTML Preparation code:
<form id="testform"> <input value="test" /> <input value="testing" /> </form> <div id="testdiv"> <input class="unique" name="unique" data-unique="1" value="test" /> <input class="unique" name="unique" data-unique="1" value="testing" /> <!-- added following divs to try and knock getElementsByClassName and getElementsByName out of the running--> <div class="test1" name="test1"> <div class="test6" name="test6"> </div> </div> <div class="test2" name="test2"> <div class="test7" name="test7"> </div> </div> <div class="test3" name="test3"> <div class="test8" name="test8"> </div> </div> <div class="test4" name="test4"> <div class="test9" name="test9"> </div> </div> <div class="test5" name="test5"> <div class="test1" name="test1"> </div> </div> <button type="submit">Submit</button> </div>
Tests:
form elements iteration
const elements = document.getElementById('testform').elements; for (const element of elements) { if (element.type === 'submit') {break;} }
querySelector
const submit_button = document.getElementById('testform').querySelector([type="submit"]);