jquery is vs hasclass vs pure
JavaScript performance comparison
Info
Added TestCase6, to also test pureJS in a "class not existent matter". Added variable "target" to ensure, the get()/getElementById process doesn't count towards the tests Added pureJS indexOf instead of regex.
Preparation code
<a class="someClass" id="someElement" href="#">link</a>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
var $t = $("#someElement");
var target = $t.get(0);
function hasClass(el, selector) {
var className = " " + selector + " ";
if ((" " + el.className + " ").replace(/[\n\t]/g, " ").indexOf(className) > -1) {
return true;
}
return false;
}
function hasClass2(element, className) {
return (' ' + element.className + ' ').indexOf(' ' + className + ' ') > -1;
}
</script>
Preparation code output
Test runner
Warning! For accurate results, please disable Firebug before running the tests. (Why?)
Java applet disabled.
| Test | Ops/sec | |
|---|---|---|
is |
|
pending… |
hasClass |
|
pending… |
pureJs |
|
pending… |
is non existing |
|
pending… |
hasClass non existing |
|
pending… |
pureJs non existing |
|
pending… |
pureJs hasClass2 |
|
pending… |
pureJs hasClass2 non-existing |
|
pending… |
Compare results of other browsers
Revisions
You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:
- Revision 1: published
- Revision 5: published
- Revision 6: published by Jeremy A. Prescott
- Revision 7: published by false
- Revision 8: published
- Revision 9: published
- Revision 10: published
- Revision 11: published
- Revision 12: published
- Revision 14: published
0 comments