Sizzle 1.7.2 vs 1.8

JavaScript performance comparison

Preparation code

<scriptsrc="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script><script>var Sizzle1_7_2 = jQuery.noConflict().find;
</script><scriptsrc="https://code.jquery.com/jquery-git.js"></script><script>var Sizzle1_8 = jQuery.noConflict().find;
</script><divid="root"><divclass="header"><h3>CSS 3 Selectors tests</h3><p>(c) <ahref="http://www.disruptive-innovations.com">Disruptive Innovations</a> 2008<br/>
Last update: 2008-06-06</p></div><divclass="test target"><divclass="unitTest"id="target"title=":target selector"></div></div><divclass="test"><divclass="blox1 unitTest"title="childhood selector"></div></div><divclass="test attributeExistence"><divclass="blox2 unitTest"align="center"title="attribute existence selector"></div><divclass="blox3 unitTest"align=""title="attribute existence selector with empty string value"></div><divclass="blox4 unitTest"valign="center"title="attribute existence selector with almost identical attribute"></div><divclass="blox5 unitTest"alignv="center"title="attribute existence selector with almost identical attribute"></div></div><divclass="test attributeValue"><divclass="blox6 unitTest"align="center"title="attribute value selector"></div><divclass="blox6 unitTest"foo="&eacute;"title="attribute value selector with an entity in the attribute and an escaped value in the selector"></div><divclass="blox6 unitTest"_foo="&eacute;"title="attribute value selector with an entity in the attribute, an escaped value in the selector, and a leading underscore in the attribute name"></div></div><divclass="test attributeSpaceSeparatedValues"><divclass="blox7 foo unitTest"title="[~=] attribute selector"></div><divclass="blox8 unitTest"title="[~=] attribute selector looking for empty string"></div><divclass="blox9 unitTest"foo=""title="[~=] attribute selector looking for empty string in empty attribute"></div><divclass="blox10 unitTest"foo="foobar"title="[~=] attribute selector looking for 'foo' in 'foobar'"></div></div><divclass="test attrStart"><divclass="unitTest t1"title="[^=] attribute selector"></div><divclass="unitTest t2"title="[^=] attribute selector"></div><divclass="unitTest t3"align="center"title="[^=] attribute selector looking for empty string"></div><divclass="unitTest t4"foo="&eacute;tagada"title="[^=] attribute selector looking for &eacute;"></div></div><divclass="test attrEnd"><divclass="unitTest t1"title="[$=] attribute selector"></div><divclass="unitTest t2"title="[$=] attribute selector"></div><divclass="unitTest t3"align="center"title="[$=] attribute selector looking for empty string"></div><divclass="unitTest t4"foo="tagada&eacute;"title="[$=] attribute selector looking for &eacute;"></div></div><divclass="test attrMiddle"><divclass="unitTest t1"title="[*=] attribute selector"></div><divclass="unitTest t2"title="[*=] attribute selector"></div><divclass="unitTest t3"align="center"title="[*=] attribute selector looking for empty string"></div><divclass="unitTest t4"foo="tagada&eacute;foo"title="[*=] attribute selector looking for &eacute;"></div></div><divclass="test firstChild"><divclass="unitTest"title=":first-child selector"></div><divclass="blox12 unitTest"title=":first-child selector should not match non first child"></div><divclass="blox13 unitTest"title=":first-child selector should not match non first child"></div></div><divclass="test not"><divclass="blox14 unitTest"title="negation pseudo-class with argument being an element type selector"></div><divclass="blox15 unitTest"foo="blox15"title="negation pseudo-class with argument being an attribute selector"></div><divclass="blox16 unitTest"foo="blox15"title="negation pseudo-class accepts only simple selectors for argument"></div></div><divclass="test onlyOfType"><divclass="blox17 unitTest"title=":only-of-type selector"></div><pclass="blox18 unitTest"title="negated :only-of-type selector"></p><pclass="blox18 unitTest"title="negated :only-of-type selector"></p></div><divclass="test nthchild1"><divclass="unitTest"title=":nth-child(odd) selector"></div><divclass="unitTest"title=":nth-last-child(odd) selector"></div><divclass="unitTest"title=":nth-child(odd) selector"></div><divclass="unitTest"title=":nth-last-child(odd) selector"></div><divclass="unitTest"title=":nth-child(odd) selector"></div><divclass="unitTest"title=":nth-last-child(odd) selector"></div></div><divclass="test nthchild2"><divclass="unitTest"title=":nth-last-child(even) selector"></div><divclass="unitTest"title=":nth-child(even) selector"></div><divclass="unitTest"title=":nth-last-child(even) selector"></div><divclass="unitTest"title=":nth-child(even) selector"></div><divclass="unitTest"title=":nth-last-child(even) selector"></div><divclass="unitTest"title=":nth-child(even) selector"></div></div><divclass="test nthchild3"><divclass="unitTest no"title=":nth-last-child(3n+3) selector"></div><divclass="unitTest"title=":nth-child(3n+2) selector"></div><divclass="unitTest no"title=":nth-last-child(3n+1) selector"></div><divclass="unitTest no"title=":nth-last-child(3n+3) selector"></div><divclass="unitTest"title=":nth-child(3n+2) selector"></div><divclass="unitTest no"title=":nth-last-child(3n+1) selector"></div></div><divclass="test nthoftype1"><divclass="unitTest"title=":nth-of-type(odd) selector"></div><pclass="unitTest"title=":nth-* selector"></p><pclass="unitTest"title=":nth-* selector"></p><divclass="unitTest"title=":nth-last-of-type(odd) selector"></div><pclass="unitTest"title=":nth-* selector"></p><divclass="unitTest"title=":nth-of-type(odd) selector"></div><divclass="unitTest"title=":nth-last-of-type(odd) selector"></div></div><divclass="test nthoftype2"><divclass="unitTest"title=":nth-last-of-type(even) selector"></div><pclass="unitTest"title=":nth-* selector"></p><pclass="unitTest"title=":nth-* selector"></p><divclass="unitTest"title=":nth-of-type(even) selector"></div><pclass="unitTest"title=":nth-* selector"></p><divclass="unitTest"title=":nth-last-of-type(even) selector"></div><divclass="unitTest"title=":nth-of-type(even) selector"></div></div><divclass="test nthoftype3"><divclass="unitTest"title=":nth-of-type(3n+1) selector"></div><pclass="unitTest"title=":nth-* selector"></p><pclass="unitTest"title=":nth-* selector"></p><divclass="unitTest"title=":nth-last-of-type(3n+2) selector"></div><pclass="unitTest"title=":nth-* selector"></p><divclass="unitTest"title=":nth-last-of-type(3n+1) selector"></div><divclass="unitTest"title=":nth-of-type(3n+1) selector"></div><pclass="unitTest"title=":nth-* selector"></p><divclass="unitTest"title=":nth-last-of-type(3n+2) selector"></div><divclass="unitTest"title=":nth-last-of-type(3n+1) selector"></div></div><divclass="test lastChild"><pclass="unitTest"title=":not(:last-child) selector"></p><divclass="unitTest"title=":last-child selector"></div>&nbsp;
</div><divclass="test firstOfType"><pclass="unitTest"title=":first-of-type selector"></p><divclass="unitTest"title=":first-of-type selector"></div><pclass="unitTest"title=":not(:first-of-type)"></p><divclass="unitTest"title=":not(:first-of-type)"></div></div><divclass="test lastOfType"><pclass="unitTest"title=":not(:last-of-type)"></p><divclass="unitTest"title=":not(:last-of-type)"></div><pclass="unitTest"title=":last-of-type selector"></p><divclass="unitTest"title=":last-of-type selector"></div></div><divclass="test onlyChild"><divclass="unitTest"title=":only-child where the element is NOT the only child"></div><divclass="unitTest"title=":only-child where the element is the only child"><divclass="unitTest"title=":only-child where the element is the only child"></div></div></div><divclass="test onlyOfType"><pclass="unitTest"title=":only-of-type"></p><divclass="unitTest"title=":only-of-type"><divclass="unitTest"title=":only-of-type"></div></div><divclass="unitTest"title=":not(only-of-type)"></div></div><divclass="test empty"><divclass="unitTest isEmpty"title=":empty with empty element"></div><divclass="unitTest isNotEmpty"title=":empty but element contains a whitespace"></div><divclass="unitTest isEmpty"title=":empty and element contains an SGML comment"><!-- foo --></div><divclass="unitTest isNotEmpty"title=":empty but element contains a SPAN element"><span></span></div><divclass="unitTest isNotEmpty"title=":empty but element contains an entity reference">&nbsp;</div></div><divclass="test lang"><divid="nofragment"class="unitTest"title=":lang() where language comes from the document"></div><divclass="unitTest"lang="fr"title=":lang() where language comes from the element"></div><divclass="unitTest"lang="en-US"title=":lang() where language comes from the element but is a dialect of the language queried"></div><divclass="unitTest t1"lang="es"title=":lang() where language comes from the element but the language queried is a dialect of the element's one so it should not match"></div></div><divclass="test attrLang"><divclass="unitTest t1"title="[|=] where language comes from the document"></div><divclass="unitTest"lang="fr"title="[|=] where language comes from the element"></div><divclass="unitTest t2"lang="en-US"title="[|=] where language comes from the element but is a dialect of the language queried"></div><divclass="unitTest t3"lang="es"title="[|=] where language comes from the element but the language queried is a dialect of the element's one so it should not match"></div></div><divclass="test UI"><buttonname="submit"type="submit"value="submit"class="t1"title=":enabled pseudo-class"><divclass="unitTest"></div></button><buttonname="submit"type="submit"value="submit"class="t2"disabled="true"title=":enabled pseudo-class"><divclass="unitTest"></div></button></div><divclass="test UI"><inputclass="t3"type="checkbox"checked="true"/><divclass="unitTest"title=":checked"></div>
the previous square should be green when the checkbox is checked and become red when you uncheck it
</div><divclass="test UI"><inputclass="t4"type="checkbox"/><divclass="unitTest"title=":not(:checked)"></div>
the previous square should be green when the checkbox is NOT checked and become red when you check it
</div><divclass="test tilda"><divclass="unitTest t1"title="~ combinator"></div><divclass="unitTest"title="~ combinator"></div><divclass="unitTest"title="~ combinator"></div><divclass="unitTest"title="~ combinator"></div><spanstyle="float:left">the three last squares should be green and become red when the pointer hovers over the white square</span></div><divclass="test plus"><divclass="unitTest t1"title="+ combinator"></div><divclass="unitTest t2"title="+ combinator"></div><divclass="unitTest"title="+ combinator"></div><spanstyle="float:left">the last square should be green and become red when the pointer hovers over the FIRST white square</span></div></div><divid="root2"><divclass="header"><h3>CSS 3 Selectors tests</h3><p>(c) <ahref="http://www.disruptive-innovations.com">Disruptive Innovations</a> 2008<br/>
Last update: 2008-06-06</p></div><divclass="test"><divclass="blox1 unitTest"title="childhood selector"></div></div><divclass="test attributeExistence"><divclass="blox2 unitTest"align="center"title="attribute existence selector"></div><divclass="blox3 unitTest"align=""title="attribute existence selector with empty string value"></div><divclass="blox4 unitTest"valign="center"title="attribute existence selector with almost identical attribute"></div><divclass="blox5 unitTest"alignv="center"title="attribute existence selector with almost identical attribute"></div></div><divclass="test attributeValue"><divclass="blox6 unitTest"align="center"title="attribute value selector"></div><divclass="blox6 unitTest"foo="&eacute;"title="attribute value selector with an entity in the attribute and an escaped value in the selector"></div><divclass="blox6 unitTest"_foo="&eacute;"title="attribute value selector with an entity in the attribute, an escaped value in the selector, and a leading underscore in the attribute name"></div></div><divclass="test attributeSpaceSeparatedValues"><divclass="blox7 foo unitTest"title="[~=] attribute selector"></div><divclass="blox8 unitTest"title="[~=] attribute selector looking for empty string"></div><divclass="blox9 unitTest"foo=""title="[~=] attribute selector looking for empty string in empty attribute"></div><divclass="blox10 unitTest"foo="foobar"title="[~=] attribute selector looking for 'foo' in 'foobar'"></div></div><divclass="test attrStart"><divclass="unitTest t1"title="[^=] attribute selector"></div><divclass="unitTest t2"title="[^=] attribute selector"></div><divclass="unitTest t3"align="center"title="[^=] attribute selector looking for empty string"></div><divclass="unitTest t4"foo="&eacute;tagada"title="[^=] attribute selector looking for &eacute;"></div></div><divclass="test attrEnd"><divclass="unitTest t1"title="[$=] attribute selector"></div><divclass="unitTest t2"title="[$=] attribute selector"></div><divclass="unitTest t3"align="center"title="[$=] attribute selector looking for empty string"></div><divclass="unitTest t4"foo="tagada&eacute;"title="[$=] attribute selector looking for &eacute;"></div></div><divclass="test attrMiddle"><divclass="unitTest t1"title="[*=] attribute selector"></div><divclass="unitTest t2"title="[*=] attribute selector"></div><divclass="unitTest t3"align="center"title="[*=] attribute selector looking for empty string"></div><divclass="unitTest t4"foo="tagada&eacute;foo"title="[*=] attribute selector looking for &eacute;"></div></div><divclass="test firstChild"><divclass="unitTest"title=":first-child selector"></div><divclass="blox12 unitTest"title=":first-child selector should not match non first child"></div><divclass="blox13 unitTest"title=":first-child selector should not match non first child"></div></div><divclass="test not"><divclass="blox14 unitTest"title="negation pseudo-class with argument being an element type selector"></div><divclass="blox15 unitTest"foo="blox15"title="negation pseudo-class with argument being an attribute selector"></div><divclass="blox16 unitTest"foo="blox15"title="negation pseudo-class accepts only simple selectors for argument"></div></div><divclass="test onlyOfType"><divclass="blox17 unitTest"title=":only-of-type selector"></div><pclass="blox18 unitTest"title="negated :only-of-type selector"></p><pclass="blox18 unitTest"title="negated :only-of-type selector"></p></div><divclass="test nthchild1"><divclass="unitTest"title=":nth-child(odd) selector"></div><divclass="unitTest"title=":nth-last-child(odd) selector"></div><divclass="unitTest"title=":nth-child(odd) selector"></div><divclass="unitTest"title=":nth-last-child(odd) selector"></div><divclass="unitTest"title=":nth-child(odd) selector"></div><divclass="unitTest"title=":nth-last-child(odd) selector"></div></div><divclass="test nthchild2"><divclass="unitTest"title=":nth-last-child(even) selector"></div><divclass="unitTest"title=":nth-child(even) selector"></div><divclass="unitTest"title=":nth-last-child(even) selector"></div><divclass="unitTest"title=":nth-child(even) selector"></div><divclass="unitTest"title=":nth-last-child(even) selector"></div><divclass="unitTest"title=":nth-child(even) selector"></div></div><divclass="test nthchild3"><divclass="unitTest no"title=":nth-last-child(3n+3) selector"></div><divclass="unitTest"title=":nth-child(3n+2) selector"></div><divclass="unitTest no"title=":nth-last-child(3n+1) selector"></div><divclass="unitTest no"title=":nth-last-child(3n+3) selector"></div><divclass="unitTest"title=":nth-child(3n+2) selector"></div><divclass="unitTest no"title=":nth-last-child(3n+1) selector"></div></div><divclass="test nthoftype1"><divclass="unitTest"title=":nth-of-type(odd) selector"></div><pclass="unitTest"title=":nth-of-* selector"></p><pclass="unitTest"title=":nth-of-* selector"></p><divclass="unitTest"title=":nth-last-of-type(odd) selector"></div><pclass="unitTest"title=":nth-of-* selector"></p><divclass="unitTest"title=":nth-of-type(odd) selector"></div><divclass="unitTest"title=":nth-last-of-type(odd) selector"></div></div><divclass="test nthoftype2"><divclass="unitTest"title=":nth-last-of-type(even) selector"></div><pclass="unitTest"title=":nth-of-* selector"></p><pclass="unitTest"title=":nth-of-* selector"></p><divclass="unitTest"title=":nth-of-type(even) selector"></div><pclass="unitTest"title=":nth-of-* selector"></p><divclass="unitTest"title=":nth-last-of-type(even) selector"></div><divclass="unitTest"title=":nth-of-type(even) selector"></div></div><divclass="test nthoftype3"><divclass="unitTest"title=":nth-of-type(3n+1) selector"></div><pclass="unitTest"title=":nth-of-* selector"></p><pclass="unitTest"title=":nth-of-* selector"></p><divclass="unitTest"title=":nth-last-of-type(3n+2) selector"></div><pclass="unitTest"title=":nth-of-* selector"></p><divclass="unitTest"title=":nth-last-of-type(3n+1) selector"></div><divclass="unitTest"title=":nth-of-type(3n+1) selector"></div><pclass="unitTest"title=":nth-of-* selector"></p><divclass="unitTest"title=":nth-last-of-type(3n+2) selector"></div><divclass="unitTest"title=":nth-last-of-type(3n+1) selector"></div></div><divclass="test lastChild"><pclass="unitTest"title=":not(:last-child) selector"></p><divclass="unitTest"title=":last-child selector"></div>&nbsp;
</div><divclass="test firstOfType"><pclass="unitTest"title=":first-of-type selector"></p><divclass="unitTest"title=":first-of-type selector"></div><pclass="unitTest"title=":not(:first-of-type)"></p><divclass="unitTest"title=":not(:first-of-type)"></div></div><divclass="test lastOfType"><pclass="unitTest"title=":not(:last-of-type)"></p><divclass="unitTest"title=":not(:last-of-type)"></div><pclass="unitTest"title=":last-of-type selector"></p><divclass="unitTest"title=":last-of-type selector"></div></div><divclass="test onlyChild"><divclass="unitTest"title=":only-child where the element is NOT the only child"></div><divclass="unitTest"title=":only-child where the element is the only child"><divclass="unitTest"title=":only-child where the element is the only child"></div></div></div><divclass="test onlyOfType"><pclass="unitTest"title=":only-of-type"></p><divclass="unitTest"title=":only-of-type"><divclass="unitTest"title=":only-of-type"></div></div><divclass="unitTest"title=":not(only-of-type)"></div></div><divclass="test empty"><divclass="unitTest isEmpty"title=":empty with empty element"></div><divclass="unitTest isNotEmpty"title=":empty but element contains a whitespace"></div><divclass="unitTest isEmpty"title=":empty and element contains an SGML comment"><!-- foo --></div><divclass="unitTest isNotEmpty"title=":empty but element contains a SPAN element"><span></span></div><divclass="unitTest isNotEmpty"title=":empty but element contains an entity reference">&nbsp;</div></div><divclass="test lang"><divid="nofragment"class="unitTest"title=":lang() where language comes from the document"></div><divclass="unitTest"lang="fr"title=":lang() where language comes from the element"></div><divclass="unitTest"lang="en-US"title=":lang() where language comes from the element but is a dialect of the language queried"></div><divclass="unitTest t1"lang="es"title=":lang() where language comes from the element but the language queried is a dialect of the element's one so it should not match"></div></div><divclass="test attrLang"><divclass="unitTest t1"title="[|=] where language comes from the document"></div><divclass="unitTest"lang="fr"title="[|=] where language comes from the element"></div><divclass="unitTest t2"lang="en-US"title="[|=] where language comes from the element but is a dialect of the language queried"></div><divclass="unitTest t3"lang="es"title="[|=] where language comes from the element but the language queried is a dialect of the element's one so it should not match"></div></div><divclass="test UI"><buttonname="submit"type="submit"value="submit"class="t1"title=":enabled pseudo-class"><divclass="unitTest"></div></button><buttonname="submit"type="submit"value="submit"class="t2"disabled="true"title=":enabled pseudo-class"><divclass="unitTest"></div></button></div><divclass="test UI"><inputclass="t3"type="checkbox"checked="true"/><divclass="unitTest"title=":checked"></div>
the previous square should be green when the checkbox is checked and become red when you uncheck it
</div><divclass="test UI"><inputclass="t4"type="checkbox"/><divclass="unitTest"title=":not(:checked)"></div>
the previous square should be green when the checkbox is NOT checked and become red when you check it
</div><divclass="test tilda"><divclass="unitTest t1"title="~ combinator"></div><divclass="unitTest"title="~ combinator"></div><divclass="unitTest"title="~ combinator"></div><divclass="unitTest"title="~ combinator"></div><spanstyle="float:left">the three last squares should be green and become red when the pointer hovers over the white square</span></div><divclass="test plus"><divclass="unitTest t1"title="+ combinator"></div><divclass="unitTest t2"title="+ combinator"></div><divclass="unitTest"title="+ combinator"></div><spanstyle="float:left">the last square should be green and become red when the pointer hovers over the FIRST white square</span></div></div><divid="root3"><divid="svgs"><!-- svg elements, but in the xhtml namespace --><svgwidth="12cm"height="4cm"viewBox="0 0 1200 400"version="1.1"id="svg1"><descid="desc1">Example circle01 - circle filled with red and stroked with blue</desc><rectid="rect1"x="1"y="1"width="1198"height="398"fill="none"stroke="blue"stroke-width="2"/><circleid="circle1"cx="600"cy="200"r="100"fill="red"stroke="blue"stroke-width="10" /></svg><!-- svg elements using svg: --><svg:svgwidth="12cm"height="4cm"viewBox="0 0 1200 400"version="1.1"id="svg2"><svg:descid="desc2">Example circle01 - circle filled with red and stroked with blue</svg:desc><svg:rectid="rect2"x="1"y="1"width="1198"height="398"fill="none"stroke="blue"stroke-width="2"/><svg:circleid="circle2"cx="600"cy="200"r="100"fill="red"stroke="blue"stroke-width="10" /></svg:svg><!-- svg using an inline xmlns --><svgwidth="12cm"height="4cm"viewBox="0 0 1200 400"xmlns="http://www.w3.org/2000/svg"version="1.1"id="svg3"><descid="desc3">Example circle01 - circle filled with red and stroked with blue</desc><rectid="rect3"x="1"y="1"width="1198"height="398"fill="none"stroke="blue"stroke-width="2"/><circleid="circle3"cx="600"cy="200"r="100"fill="red"stroke="blue"stroke-width="10" /></svg></div></div>