jQuery .hasClass() vs .filter() vs native performance (v10)

Revision 10 of this benchmark created on


Description

Compare hasClass() to filter() when checking for class attribute

Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
var inpute = '<input type="checkbox" class="bar" checked="checked">';
  var $foo = $('input');
  var _foo = document.getElementsByTagName('input');
var matches = function(el, selector) {
  return (el.matches || el.matchesSelector || el.msMatchesSelector || el.mozMatchesSelector || el.webkitMatchesSelector || el.oMatchesSelector).call(el, selector);
};
for(var i = 1;i<=500;i++){
$(body).append(input);
}
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
.hasClass()
($foo.hasClass('bar').length > 0);
ready
.filter()
($foo.filter(".bar").length > 0);
ready
native
$(_foo).each(function(el) {
  matches(el, '.bar');
})
ready

Revisions

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