qsa.matchesSelector vs. jQuery.is, disable native Selectors (v14)

Revision 14 of this benchmark created on

Description

Testing selector matching on library "jQuery" vs "QSA Selector Engine"

Preparation HTML

<script>
  // disable native qSA
  if ( document.querySelectorAll ) {
     document.querySelectorAll = null;
  }
  if ( window.Element && window.Element.prototype ) {
     window.Element.prototype.querySelectorAll = null;
  }
  if ( window.Document && window.Document.prototype ) {
     window.Document.prototype.querySelectorAll = null;
  }

  // disable native matchesSelector on HTML Element
  var docEl = document.documentElement;
  docEl.matchesSelector = docEl.oMatchesSelector = docEl.mozMatchesSelector = docEl.webkitMatchesSelector = docEl.msMatchesSelector = null;

</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="https://raw.github.com/devote/QSA/master/qsa.js"></script>
<div class="level1">
    <div class="level2">
        <div class="level3">
            <div class="level4">
                <div class="level5" id="foo">
                </div>
                <div class="level5">
                </div>
                <div class="level5">
                </div>
            </div>
        </div>
    </div>
</div>
<script>
  
  var $element = jQuery(jQuery('.level1 .level2 .level3 .level4 .level5')[0]); // Get first result and add wrap with jQuery object

  var domEl = $element[0];
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
Using $.fn.is
$element.is('.level1 .level2 .level3 .level4 .level5');
ready
Using QSA matchesSelector
qsa.matchesSelector(domEl, '.level1 .level2 .level3 .level4 .level5');
ready

Revisions

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