Zepto.js vs jQuery - selectors (v125)

Revision 125 of this benchmark created by netwjx on


Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/zepto/1.1.6/zepto.min.js"></script>
<script>
        function $_(str){
                if(str[0] === '#') {
                        return document.getElementById(str.substring(1));
                } else if(str[0] === '.') {
                        return document.getElementsByClassName(str.substring(1));
                } else {
                        return document.getElementsByTagName(str);
                }
        }

</script>

<div id="rsvp" class="view" data-view-title="RSVPs">
    <div class="content"></div>
</div>
<div id="chapter_004" class="view" data-view-title="Splendid Corgi Consortium">
    <div class="content"></div>
<div>
        <div>
                <div>
                        <div>
                                <div>
                                        <div>
                                                <div>
                                                        <div>
                                                                <div>
                                                                        <div>
                                                                                <div>
                                                                                        <div id="ops">
                                                                                                <div>
                                                                                                        <div>
                                                                                                                <div>
                                                                                                                        <div>
                                                                                                                                <div>
                                                                                                                                        <div>
                                                                                                                                                <div>
                                                                                                                                                        <div>
                                                                                                                                                                <div class="ops">
                                                                                                                                                                        <div>
                                                                                                                                                                                <div>
                                                                                                                                                                                        <div>
                                                                                                                                                                                                <div>
                                                                                                                                                                                                        <div>
                                                                                                                                                                                                                <div>
                                                                                                                                                                                                                        <div>
                                                                                                                                                                                                                                <div>
                                                                                                                                                                                                                                        <div>
                                                                                                                                                                                                                                                <div>
                                                                                                                                                                                                                                                        <div  class="ops"></div>
                                                                                                                                                                                                                                                </div>
                                                                                                                                                                                                                                        </div>
                                                                                                                                                                                                                                </div>
                                                                                                                                                                                                                        </div>
                                                                                                                                                                                                                </div>
                                                                                                                                                                                                        </div>
                                                                                                                                                                                                </div>
                                                                                                                                                                                        </div>
                                                                                                                                                                                </div>
                                                                                                                                                                        </div>
                                                                                                                                                                </div>
                                                                                                                                                        </div>
                                                                                                                                                </div>
                                                                                                                                        </div>
                                                                                                                                </div>
                                                                                                                        </div>
                                                                                                                </div>
                                                                                                        </div>
                                                                                                </div>
                                                                                        </div>
                                                                                </div>
                                                                        </div>
                                                                </div>
                                                        </div>
                                                </div>
                                        </div>
                                </div>
                        </div>
                </div>
        </div>
</div>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
Zepto ID
Zepto('#ops')
ready
jQuery ID
jQuery('#ops')
ready
Zepto Class
Zepto('.ops')
ready
jQuery Class
jQuery('.ops')
ready
Zepto Tag
Zepto('div')
ready
jQuery Tag
jQuery('div')
ready
Zepto ID + Class
Zepto('#ops .ops')
ready
jQuery ID + Class
jQuery('#ops .ops')
ready
Zepto Class + Tag
Zepto('.ops div')
ready
jQuery Class + Tag
jQuery('.ops div')
ready
Zepto ID + Tag
Zepto('#ops div')
ready
jQuery ID + Tag
jQuery('#ops div')
ready
Zepto Class + Class
Zepto('.ops .ops')
ready
jQuery Class + Class
jQuery('.ops .ops')
ready

Revisions

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