Raw Data Selector Performance (v37)

Revision 37 of this benchmark created by Mihai Parparita on

Preparation HTML

<ul id="test"></ul>

Setup

var ul = document.querySelector("#test");
    for (var i = 0; i < 1000; i++) {
      var li = document.createElement("li");
      li.textContent = "List Item " + i;
      if (i % 2) {
        li.setAttribute("data-component", "list-item");
        li.className = "list-item my-other-class";
      }
      ul.appendChild(li);
    }

Teardown


    ul.innerHTML = "";
   

Test runner

Ready to run.

Testing in
TestOps/sec
data selector
document.querySelectorAll("[data-component=\"list-item\"]")
ready
class selector
document.querySelectorAll(".list-item")
ready
two classes
document.querySelectorAll(".list-item.my-other-class")
ready

Revisions

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