nested selecting vs root sleected

Benchmark created on

Preparation HTML

<div id="outer">
    <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
progressive selecting
var div=document.querySelector("div");
for(var j=0; j<9; j++)
{
    div=div.querySelector("div");
}
ready
selecting from root
var str="div";
for(var j=0; j<10; j++)
{
    var div=document.querySelector(str);
    str+=" > div";
}
ready

Revisions

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