getElementsByTagName vs querySelector from a known element for a single element

Benchmark created on

Preparation HTML

<div class="wrapper">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
 <menu class="menu"></menu>
</div>

Setup

const [wrapper] = document.getElementsByClassName('wrapper')

Test runner

Ready to run.

Testing in
TestOps/sec
querySelector
const menu = wrapper.querySelector('menu')
ready
getElementsByTagName
const menu = wrapper.getElementsByTagName('menu')[0]
ready
querySelectorAll
const menu = wrapper.querySelectorAll('menu')[0]
ready
getElementsByClassName
const menu = wrapper.getElementsByClassName('menu')[0]
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.