Run results for: TreeWalker vs querySelectorAll (* all elements) 2

Run details:
User agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/102.0.5005.63 Safari/537.36
Browser: Chrome 102
Operating system: Windows
Device Platform: Desktop
Date tested: 2 years ago
Test name	Executions per second
TreeWalker	25829.2 Ops/sec
querySelectorAll	31727.0 Ops/sec
HTML Preparation code:
<body>
    <div class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="sr-only" data-precheck="false">Toggle navigation</span>
                    <span class="icon-bar" data-precheck="false"></span>
                    <span class="icon-bar" data-precheck="false"></span>
                    <span class="icon-bar" data-precheck="false"></span>
                </button>
                <a class="navbar-brand" href="/"><i class="fa fa-bar-chart" aria-hidden="true" data-precheck="false"></i>&nbsp;MeasureThat.net</a>
            </div>
            <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li><a href="/Benchmarks/Add" data-precheck="false">Create a benchmark</a></li>
                    <li><a href="/Tools">Online Tools<sup data-precheck="false">new</sup></a></li>
                    <li><a data-toggle="modal" data-target="#aboutModal" href="#" data-precheck="false">About</a></li>
                    <li><a href="/Home/Discussions" data-precheck="false">Feedback</a></li>
                    <li><a target="_blank" href="https://www.paypal.com/cgi-bin/webscr?cmd=_donations&amp;no_note=0&amp;lc=US&amp;currency_code=USD&amp;bn=PP-DonationsBF:btn_donate_LG.gif:NonHostedGuest&amp;business=MeasureThat@outlook.com&amp;item_name=MeasureThat&amp;item_number=Support%20service&amp;amount=0"><img src="https://www.paypalobjects.com/en_GB/i/btn/btn_donate_LG.gif" border="0" alt="PayPal — The safer, easier way to pay online." data-precheck="false"></a></li>
                </ul>
                

    <form method="post" id="logoutForm" class="navbar-right" action="/Account/LogOff">
        <ul class="nav navbar-nav navbar-right">
            <li>
                <a title="Manage" href="/Manage" data-precheck="false">Hello rilex98677@iconzap.com!</a>
            </li>
            <li>
                <button type="submit" class="btn btn-link navbar-btn navbar-link" data-precheck="false">Log off</button>
            </li>
        </ul>
    <input name="__RequestVerificationToken" type="hidden" value="CfDJ8BYV91WYjT9OvOiHKyU7Td8sVLB3r7zcuqkzhquGJ1-r9vFv7FkPJl2mfW73CCgtuAj6gsu9KyDtfJJVchhaL1nfUbcczjsgqpa9Y78co69ikK5He3EBL0UXNipz6XkWsPCL-h5T18udx8EPHzPZHUxruWfTa8h-EU9wSjKsIh0NKX0tPzivEUM5DrzMJ95NOw" data-precheck="false"></form>

            </div>
        </div>
    </div>
    

    

    <div class="container body-content">
        <div class="row">
            


<div class="page-header">
    <h1 data-precheck="false">Edit benchmark</h1>
</div>


<form action="/Benchmarks/Edit/19187" id="new-benchmark-form" method="post" novalidate="novalidate"><div class="validation-summary-valid" data-valmsg-summary="true"><ul><li style="display:none" data-precheck="false"></li>
</ul></div><input data-val="true" data-val-required="The Id field is required." id="Id" name="Id" type="hidden" value="19187" data-precheck="false">    <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
        <div class="panel panel-default">
            <div class="panel-heading" role="tab" id="headingOne">
                <h4 class="panel-title">
                    <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne" data-precheck="false">
                        Benchmark name and description
                    </a>
                </h4>
            </div>
            <div id="collapseOne" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingOne">
                <div class="panel-body">
                    <div class="form-group">
                        <label for="BenchmarkName" data-precheck="false">Benchmark Name</label>
                        <input class="form-control" data-val="true" data-val-length="The Benchmark Name must be at least 6 and at max 200 characters long." data-val-length-max="200" data-val-length-min="6" data-val-required="The Benchmark Name field is required." id="BenchmarkName" name="BenchmarkName" placeholder="Name of the benchmark" type="text" value="TreeWalker vs querySelectorAll (* all elements) 2" data-precheck="false">
                        <span id="dup-title" class="text-danger field-validation-error" style="" data-precheck="false">Benchmark with such name already exists.</span>
                        <span class="field-validation-valid text-danger" data-valmsg-for="BenchmarkName" data-valmsg-replace="true" data-precheck="false"></span>
                    </div>
                    <div class="form-group">
                        <label for="Description" data-precheck="false">Description</label>
                        <textarea class="form-control" data-val="true" data-val-length="The Description must be at max 4000 characters long." data-val-length-max="4000" id="Description" name="Description" placeholder="Benchmark description" data-precheck="false">sdf</textarea>
                        <span class="field-validation-valid text-danger" data-valmsg-for="Description" data-valmsg-replace="true" data-precheck="false"></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="panel panel-default">
            <div class="panel-heading" role="tab" id="headingTwo">
                <h4 class="panel-title">
                    <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo" data-precheck="false">
                        Preparation code
                    </a>
                </h4>
            </div>
            <div id="collapseTwo" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingTwo">
                <div class="panel-body">
                    <div class="form-group">
                        <label for="HtmlPreparationCode" data-precheck="false">Html Preparation code</label>
                        <textarea class="form-control" id="HtmlPreparationCode" name="HtmlPreparationCode" style="display: none;" data-precheck="false">&lt;!-- article out start --&gt;
&lt;article&gt;
  &lt;!-- article in start --&gt;
  &lt;h1&gt;Lorem ipsum&lt;/h1&gt;
  &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, nostrum.&lt;/p&gt;
  &lt;!-- article in end --&gt;
&lt;/article&gt;
&lt;!-- article out end --&gt;

&lt;!-- article out start --&gt;
&lt;article&gt;
  &lt;!-- article in start --&gt;
  &lt;h1&gt;Lorem ipsum&lt;/h1&gt;
  &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, nostrum.&lt;/p&gt;
  &lt;!-- article in end --&gt;
&lt;/article&gt;
&lt;!-- article out end --&gt;

&lt;!-- article out start --&gt;
&lt;article&gt;
  &lt;!-- article in start --&gt;
  &lt;h1&gt;Lorem ipsum&lt;/h1&gt;
  &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cumque, nostrum.&lt;/p&gt;
  &lt;!-- article in end --&gt;
&lt;/article&gt;
&lt;!-- article out end --&gt;</textarea><div class="CodeMirror cm-s-default"><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 11px; left: 47px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" style="position: absolute; padding: 0px; width: 1000px; height: 1em; outline: none;" tabindex="0" data-precheck="false"></textarea></div><div class="CodeMirror-vscrollbar" cm-not-content="true" style="bottom: 0px;"><div style="min-width: 1px; height: 0px;" data-precheck="false"></div></div><div class="CodeMirror-hscrollbar" cm-not-content="true"><div style="height: 100%; min-height: 1px; width: 0px;" data-precheck="false"></div></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true" data-precheck="false"></div><div class="CodeMirror-gutter-filler" cm-not-content="true" data-precheck="false"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 30px; margin-bottom: -17px; border-right-width: 13px; min-height: 28px; min-width: 7px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines"><div style="position: relative; outline: none;"><div class="CodeMirror-measure"><pre>x</pre><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div>1</div></div></div><div class="CodeMirror-measure" data-precheck="false"></div><div style="position: relative; z-index: 1;" data-precheck="false"></div><div class="CodeMirror-cursors" style=""><div class="CodeMirror-cursor" style="left: 4px; top: 0px; height: 20px;">&nbsp;</div></div><div class="CodeMirror-code" style=""><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;">1</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;"><span cm-text=""></span></span></pre></div></div></div></div></div></div><div style="position: absolute; height: 13px; width: 1px; border-bottom: 0px solid transparent; top: 28px;" data-precheck="false"></div><div class="CodeMirror-gutters" style="height: 41px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 29px;" data-precheck="false"></div></div></div></div>
                        <span class="field-validation-valid text-danger" data-valmsg-for="HtmlPreparationCode" data-valmsg-replace="true" data-precheck="false"></span>
                        <br data-precheck="false">
                        <div class="btn-group">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                Quick HTML Snippets: <span class="caret" data-precheck="false"></span>
                            </button>
                            <ul class="dropdown-menu">
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<div id=''></div>" data-precheck="false">&lt;div/&gt;</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<a id='' href='#' />" data-precheck="false">&lt;a/&gt;</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<canvas id='' width='' height=''></canvas>" data-precheck="false">&lt;canvas/&gt;</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src=''></script>" data-precheck="false">&lt;script&gt;</a></li>
                            </ul>
                        </div>
                        <div class="btn-group">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                Reference popular libraries: <span class="caret" data-precheck="false"></span>
                            </button>
                            <ul class="dropdown-menu">
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js'></script>" data-precheck="false">jQuery</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src='https://cdnjs.cloudflare.com/ajax/libs/react/16.3.0/cjs/react.production.min.js'></script>" data-precheck="false">React.JS</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src='https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js'></script>" data-precheck="false">lodash</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src='https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.0/moment.min.js'></script>" data-precheck="false">moment.js</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src='https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min.js'></script>" data-precheck="false">Chart.js</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src='https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js'></script>" data-precheck="false">jqueryui</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src='https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js'></script>" data-precheck="false">underscore.js</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src='https://cdnjs.cloudflare.com/ajax/libs/d3/4.13.0/d3.min.js'></script>" data-precheck="false">d3</a></li>
                                <li><a data-role="insert-snippet" data-target="HtmlPreparationCode" data-text="<script src='https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.5/angular.min.js'></script>" data-precheck="false">angular.js</a></li>
                            </ul>
                        </div>
                        <button type="button" class="btn btn-default" data-format-type="html" data-role="format-input" data-target="HtmlPreparationCode" id="format_html" data-precheck="false">
                            Format HTML
                        </button>
                    </div>
                    <hr data-precheck="false">
                    <div class="form-group">
                        <label for="ScriptPreparationCode" data-precheck="false">JavaScript preparation code</label>
                        <textarea class="form-control" id="ScriptPreparationCode" name="ScriptPreparationCode" style="display: none;" data-precheck="false"></textarea><div class="CodeMirror cm-s-default"><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 11px; left: 47px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" style="position: absolute; padding: 0px; width: 1000px; height: 1em; outline: none;" tabindex="0" data-precheck="false"></textarea></div><div class="CodeMirror-vscrollbar" cm-not-content="true"><div style="min-width: 1px; height: 0px;" data-precheck="false"></div></div><div class="CodeMirror-hscrollbar" cm-not-content="true"><div style="height: 100%; min-height: 1px; width: 0px;" data-precheck="false"></div></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true" data-precheck="false"></div><div class="CodeMirror-gutter-filler" cm-not-content="true" data-precheck="false"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 30px; margin-bottom: -17px; border-right-width: 13px; min-height: 28px; min-width: 7px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines"><div style="position: relative; outline: none;"><div class="CodeMirror-measure"><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div data-precheck="false">1</div></div></div><div class="CodeMirror-measure" data-precheck="false"></div><div style="position: relative; z-index: 1;" data-precheck="false"></div><div class="CodeMirror-cursors"><div class="CodeMirror-cursor" style="left: 4px; top: 0px; height: 20px;">&nbsp;</div></div><div class="CodeMirror-code"><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">1</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;"><span cm-text="" data-precheck="false"></span></span></pre></div></div></div></div></div></div><div style="position: absolute; height: 13px; width: 1px; border-bottom: 0px solid transparent; top: 28px;" data-precheck="false"></div><div class="CodeMirror-gutters" style="height: 41px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 29px;" data-precheck="false"></div></div></div></div>
                        <span class="field-validation-valid text-danger" data-valmsg-for="ScriptPreparationCode" data-valmsg-replace="true" data-precheck="false"></span>
                        <div class="btn-group">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                New Script snippets: <span class="caret" data-precheck="false"></span>
                            </button>
                            <ul class="dropdown-menu">
                                <li><a data-role="insert-snippet" data-target="ScriptPreparationCode" data-text="for(i=0; i<10; i++){}" data-precheck="false">For loop</a></li>
                                <li><a data-role="insert-snippet" data-target="ScriptPreparationCode" data-text="var arr = ['', '', ''];" data-precheck="false">Array</a></li>
                                <li><a data-role="insert-snippet" data-target="ScriptPreparationCode" data-text="var el = document.getElementById('');" data-precheck="false">document.getElementById</a></li>
                                <li><a data-role="insert-snippet" data-target="ScriptPreparationCode" data-text="console.log('');" data-precheck="false">console.log</a></li>
                            </ul>
                        </div>
                        <button type="button" class="btn btn-default" data-target="ScriptPreparationCode" data-format-type="js" data-role="format-input" data-precheck="false">
                            Format JavaScript
                        </button>
                    </div>
                </div>
            </div>
        </div>
        <div class="panel panel-default">
            <div class="panel-heading" role="tab" id="headingThree">
                <h4 class="panel-title">
                    <a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseThree" aria-expanded="true" aria-controls="collapseThree" data-precheck="false">
                        Test cases
                    </a>
                </h4>
            </div>
            <div id="collapseThree" class="panel-collapse collapse in" role="tabpanel" aria-labelledby="headingThree">
                <ul class="list-group" id="test-case-list"><li class="list-group-item" data-role="testCaseComponent">
            <div class="form-group">
                <label for="TestCases.TestCaseDtoName" data-precheck="false">Name your test:</label>
                <input type="text" class="form-control" placeholder="Name of the test case" data-val="true" data-val-regex="The field Test Case must match the regular expression '[a-zA-Z0-9.`~!@#$%^&amp;*()]'." data-val-regex-pattern="[a-zA-Z0-9.`~!@#$%^&amp;*()]" data-val-required="The Test Case field is required." name="TestCases[0].TestCaseDtoName" value="TreeWalker" data-role="testCaseName" data-precheck="false">

                <label for="TestCases.BenchmarkCode" data-precheck="false">Benchmark code</label>
                <textarea class="form-control" data-val="true" placeholder="Benchmark code" data-val-required="The Benchmark code is required." name="TestCases[0].BenchmarkCode" data-role="testCaseCode" style="display: none;" data-precheck="false">const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW_ELEMENT
);

let element;
while (element = treeWalker.nextNode()) {
    
}</textarea><div class="CodeMirror cm-s-default"><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 11px; left: 47px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" style="position: absolute; padding: 0px; width: 1000px; height: 1em; outline: none;" tabindex="0" data-precheck="false"></textarea></div><div class="CodeMirror-vscrollbar" cm-not-content="true"><div style="min-width: 1px; height: 0px;" data-precheck="false"></div></div><div class="CodeMirror-hscrollbar" cm-not-content="true"><div style="height: 100%; min-height: 1px; width: 0px;" data-precheck="false"></div></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true" data-precheck="false"></div><div class="CodeMirror-gutter-filler" cm-not-content="true" data-precheck="false"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 30px; margin-bottom: -17px; border-right-width: 13px; min-height: 188px; min-width: 353.396px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines"><div style="position: relative; outline: none;"><div class="CodeMirror-measure"><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div data-precheck="false">9</div></div></div><div class="CodeMirror-measure" data-precheck="false"></div><div style="position: relative; z-index: 1;" data-precheck="false"></div><div class="CodeMirror-cursors"><div class="CodeMirror-cursor" style="left: 4px; top: 0px; height: 20px;">&nbsp;</div></div><div class="CodeMirror-code" style=""><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">1</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;"><span class="cm-keyword" data-precheck="false">const</span> <span class="cm-def" data-precheck="false">treeWalker</span> <span class="cm-operator" data-precheck="false">=</span> <span class="cm-variable" data-precheck="false">document</span>.<span class="cm-property" data-precheck="false">createTreeWalker</span>(</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">2</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;">  <span class="cm-variable" data-precheck="false">document</span>.<span class="cm-property" data-precheck="false">body</span>,</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">3</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;">  <span class="cm-variable" data-precheck="false">NodeFilter</span>.<span class="cm-property" data-precheck="false">SHOW_ELEMENT</span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">4</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;" data-precheck="false">);</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">5</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;"><span cm-text="" data-precheck="false"></span></span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">6</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;"><span class="cm-keyword" data-precheck="false">let</span> <span class="cm-def" data-precheck="false">element</span>;</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">7</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;"><span class="cm-keyword" data-precheck="false">while</span> (<span class="cm-variable" data-precheck="false">element</span> <span class="cm-operator" data-precheck="false">=</span> <span class="cm-variable" data-precheck="false">treeWalker</span>.<span class="cm-property" data-precheck="false">nextNode</span>()) {</span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">8</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;" data-precheck="false">    </span></pre></div><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">9</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;" data-precheck="false">}</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 13px; width: 1px; border-bottom: 0px solid transparent; top: 188px;" data-precheck="false"></div><div class="CodeMirror-gutters" style="height: 201px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 29px;" data-precheck="false"></div></div></div></div>
                <span class="field-validation-valid text-danger" data-valmsg-for="TestCases.BenchmarkCode" data-valmsg-replace="true" data-precheck="false"></span>
            </div>
            <div class="form-group text-right">
                <button data-action="delete-test" class="btn btn-default" data-precheck="false">Delete test case</button>
            </div>
        </li><li class="list-group-item" data-role="testCaseComponent">
            <div class="form-group">
                <label for="TestCases.TestCaseDtoName" data-precheck="false">Name your test:</label>
                <input type="text" class="form-control" placeholder="Name of the test case" data-val="true" data-val-regex="The field Test Case must match the regular expression '[a-zA-Z0-9.`~!@#$%^&amp;*()]'." data-val-regex-pattern="[a-zA-Z0-9.`~!@#$%^&amp;*()]" data-val-required="The Test Case field is required." name="TestCases[1].TestCaseDtoName" value="querySelectorAll" data-role="testCaseName" data-precheck="false">

                <label for="TestCases.BenchmarkCode" data-precheck="false">Benchmark code</label>
                <textarea class="form-control" data-val="true" placeholder="Benchmark code" data-val-required="The Benchmark code is required." name="TestCases[1].BenchmarkCode" data-role="testCaseCode" style="display: none;" data-precheck="false">const list = document.body.querySelectorAll('*');</textarea><div class="CodeMirror cm-s-default"><div style="overflow: hidden; position: relative; width: 3px; height: 0px; top: 11px; left: 47px;"><textarea autocorrect="off" autocapitalize="off" spellcheck="false" style="position: absolute; padding: 0px; width: 1000px; height: 1em; outline: none;" tabindex="0" data-precheck="false"></textarea></div><div class="CodeMirror-vscrollbar" cm-not-content="true"><div style="min-width: 1px; height: 0px;" data-precheck="false"></div></div><div class="CodeMirror-hscrollbar" cm-not-content="true"><div style="height: 100%; min-height: 1px; width: 0px;" data-precheck="false"></div></div><div class="CodeMirror-scrollbar-filler" cm-not-content="true" data-precheck="false"></div><div class="CodeMirror-gutter-filler" cm-not-content="true" data-precheck="false"></div><div class="CodeMirror-scroll" tabindex="-1"><div class="CodeMirror-sizer" style="margin-left: 30px; margin-bottom: -17px; border-right-width: 13px; min-height: 28px; min-width: 384.188px; padding-right: 0px; padding-bottom: 0px;"><div style="position: relative; top: 0px;"><div class="CodeMirror-lines"><div style="position: relative; outline: none;"><div class="CodeMirror-measure"><div class="CodeMirror-linenumber CodeMirror-gutter-elt"><div data-precheck="false">1</div></div></div><div class="CodeMirror-measure" data-precheck="false"></div><div style="position: relative; z-index: 1;" data-precheck="false"></div><div class="CodeMirror-cursors"><div class="CodeMirror-cursor" style="left: 4px; top: 0px; height: 20px;">&nbsp;</div></div><div class="CodeMirror-code"><div style="position: relative;"><div class="CodeMirror-gutter-wrapper" style="left: -30px;"><div class="CodeMirror-linenumber CodeMirror-gutter-elt" style="left: 0px; width: 21px;" data-precheck="false">1</div></div><pre class=" CodeMirror-line "><span style="padding-right: 0.1px;"><span class="cm-keyword" data-precheck="false">const</span> <span class="cm-def" data-precheck="false">list</span> <span class="cm-operator" data-precheck="false">=</span> <span class="cm-variable" data-precheck="false">document</span>.<span class="cm-property" data-precheck="false">body</span>.<span class="cm-property" data-precheck="false">querySelectorAll</span>(<span class="cm-string" data-precheck="false">'*'</span>);</span></pre></div></div></div></div></div></div><div style="position: absolute; height: 13px; width: 1px; border-bottom: 0px solid transparent; top: 28px;" data-precheck="false"></div><div class="CodeMirror-gutters" style="height: 41px;"><div class="CodeMirror-gutter CodeMirror-linenumbers" style="width: 29px;" data-precheck="false"></div></div></div></div>
                <span class="field-validation-valid text-danger" data-valmsg-for="TestCases.BenchmarkCode" data-valmsg-replace="true" data-precheck="false"></span>
            </div>
            <div class="form-group text-right">
                <button data-action="delete-test" class="btn btn-default" data-precheck="false">Delete test case</button>
            </div>
        </li></ul>
                <div class="panel-footer">
                    <span class="field-validation-valid text-danger" data-valmsg-for="TestCases" data-valmsg-replace="true" data-precheck="false"></span>
                    <div class="form-group">
                        <input type="button" class="btn btn-default" data-action="new-test" value="Add test case" data-precheck="false">
                    </div>
                </div>
            </div>
        </div>
    </div>
        <div class="form-group">
            <div class="g-recaptcha" data-sitekey="6LezciITAAAAAM8yvrfrR23FDpltM8Luz9QB_8O0"><div style="width: 304px; height: 78px;"><div><iframe title="reCAPTCHA" src="https://www.google.com/recaptcha/api2/anchor?ar=1&amp;k=6LezciITAAAAAM8yvrfrR23FDpltM8Luz9QB_8O0&amp;co=aHR0cHM6Ly93d3cubWVhc3VyZXRoYXQubmV0OjQ0Mw..&amp;hl=en&amp;v=M-QqaF9xk6BpjLH22uHZRhXt&amp;size=normal&amp;cb=snbga8ckkqeu" width="304" height="78" role="presentation" name="a-ah32scue0a5s" frameborder="0" scrolling="no" sandbox="allow-forms allow-popups allow-same-origin allow-scripts allow-top-navigation allow-modals allow-popups-to-escape-sandbox" data-precheck="false"></iframe></div><textarea id="g-recaptcha-response" name="g-recaptcha-response" class="g-recaptcha-response" style="width: 250px; height: 40px; border: 1px solid rgb(193, 193, 193); margin: 10px 25px; padding: 0px; resize: none; display: none;" data-precheck="false"></textarea></div><iframe style="display: none;"></iframe></div>
            <span class="field-validation-valid text-danger" data-valmsg-for="ReCaptcha" data-valmsg-replace="true" data-precheck="false"></span>
        </div>
    <div class="alert alert-warning" role="alert">
        To avoid adding broken tests, please use <strong data-precheck="false">Validate benchmark</strong> button to check for errors in benchmark definition.
    </div>
    <div style="display:none" id="validation_log_holder">
        <h5 data-precheck="false">Validation log:</h5>
        <ul id="validation_log" data-precheck="false"></ul>
    </div>
    <a class="btn btn-default" data-role="test-benchmark">
        Validate benchmark<span data-precheck="false">&nbsp;</span>
        <i id="validate-spinner" class="fa fa-refresh fa-spin" style="font-size:20px;display:none;" data-precheck="false"></i>
    </a>
    <input id="benchmark_submit" type="submit" class="btn btn-primary" value="Submit" data-precheck="false">
    <a href="/Benchmarks" class="btn btn-link" data-precheck="false">Cancel</a>
<input name="__RequestVerificationToken" type="hidden" value="CfDJ8BYV91WYjT9OvOiHKyU7Td8sVLB3r7zcuqkzhquGJ1-r9vFv7FkPJl2mfW73CCgtuAj6gsu9KyDtfJJVchhaL1nfUbcczjsgqpa9Y78co69ikK5He3EBL0UXNipz6XkWsPCL-h5T18udx8EPHzPZHUxruWfTa8h-EU9wSjKsIh0NKX0tPzivEUM5DrzMJ95NOw" data-precheck="false"></form>
<div class="hidden">
            <textarea data-content="existing-test" data-test-name="TreeWalker" data-precheck="false">const treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW_ELEMENT
);

let element;
while (element = treeWalker.nextNode()) {
    
}</textarea>
            <textarea data-content="existing-test" data-test-name="querySelectorAll" data-precheck="false">const list = document.body.querySelectorAll('*');</textarea>
</div>

<div id="validation-frame-holder" data-precheck="false"></div>



        </div>
        <hr data-precheck="false">
        <footer>
            <p data-precheck="false">© 2022 - MeasureThat.net (Version: 1.3.3.0)</p>
        </footer>

    </div><script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.2.0.min.js" data-precheck="false">
    </script>
<script data-precheck="false">(window.jQuery||document.write("\u003Cscript src=\u0022\/lib\/jquery\/dist\/jquery.min.js\u0022\u003E\u003C\/script\u003E"));</script>
    <script src="https://ajax.aspnetcdn.com/ajax/bootstrap/3.3.6/bootstrap.min.js" data-precheck="false">
    </script>
<script data-precheck="false">(window.jQuery && window.jQuery.fn && window.jQuery.fn.modal||document.write("\u003Cscript src=\u0022\/lib\/bootstrap\/dist\/js\/bootstrap.min.js\u0022\u003E\u003C\/script\u003E"));</script>


    


    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.16.0/codemirror.min.js" data-precheck="false"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.17.0/mode/xml/xml.js" data-precheck="false"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.16.0/mode/javascript/javascript.min.js" data-precheck="false"></script>


    <script src="https://www.google.com/recaptcha/api.js" data-precheck="false"></script>

    
    
        <script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.1.3/mustache.min.js" data-precheck="false"></script>
    

    <script src="/js/benchmarklab.js?v=u7xTtWrvm6FZPW1nPTf3WFWWTmn7xc_Q8WbQvfFXm58" data-precheck="false"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.11.0/beautify.min.js" data-precheck="false"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/js-beautify/1.11.0/beautify-html.min.js" data-precheck="false"></script>



    <script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js" data-precheck="false">
    </script>
<script data-precheck="false">(window.jQuery && window.jQuery.validator||document.write("\u003Cscript src=\u0022\/lib\/jquery-validation\/dist\/jquery.validate.min.js\u0022\u003E\u003C\/script\u003E"));</script>
    <script src="https://ajax.aspnetcdn.com/ajax/jquery.validation.unobtrusive/3.2.6/jquery.validate.unobtrusive.min.js" data-precheck="false">
    </script>
<script data-precheck="false">(window.jQuery && window.jQuery.validator && window.jQuery.validator.unobtrusive||document.write("\u003Cscript src=\u0022\/lib\/jquery-validation-unobtrusive\/jquery.validate.unobtrusive.min.js\u0022\u003E\u003C\/script\u003E"));</script>



    <script id="testCase" type="x-tmpl-mustache" data-precheck="false">
        <li class="list-group-item" data-role="testCaseComponent">
            <div class="form-group">
                <label for="TestCases.TestCaseDtoName">Name your test:</label>
                <input type="text" class="form-control" placeholder="Name of the test case" data-val="true" data-val-regex="The field Test Case must match the regular expression '[a-zA-Z0-9.`~!@#$%^&amp;*()]'." data-val-regex-pattern="[a-zA-Z0-9.`~!@#$%^&amp;*()]" data-val-required="The Test Case field is required." name="TestCases[{{testCaseId}}].TestCaseDtoName" value="{{testCaseName}}" data-role="testCaseName">

                <label for="TestCases.BenchmarkCode">Benchmark code</label>
                <textarea class="form-control" data-val="true" placeholder="Benchmark code" data-val-required="The Benchmark code is required." name="TestCases[{{testCaseId}}].BenchmarkCode" data-role="testCaseCode">{{textCaseContent}}</textarea>
                <span class="field-validation-valid text-danger" data-valmsg-for="TestCases.BenchmarkCode" data-valmsg-replace="true"></span>
            </div>
            <div class="form-group text-right">
                <button data-action="delete-test" class="btn btn-default">Delete test case</button>
            </div>
        </li>
    </script>

    <script type="text/javascript" data-precheck="false">
        var addPageController = new AddNewTestPageController();
        new AppendSnippetHandler();
        new ClientValidationHandler();
        new InputFormatHandler();
    </script>


    <div class="modal fade" id="aboutModal" tabindex="-1" role="dialog" aria-labelledby="myModal-label" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" data-precheck="false">×</button>
                <h4 class="modal-title" id="myModal-label" data-precheck="false">About</h4>
            </div>
            <div class="modal-body">
                <h2 data-precheck="false">JavaScript performance benchmarks</h2>
                <p><b data-precheck="false">Source code:</b> <a target="_blank" href="https://github.com/thecoderok/MeasureThat.net" data-precheck="false">GitHub/MeasureThat.net</a></p>
                <p><b data-precheck="false">Report issues:</b> <a target="_blank" href="https://github.com/thecoderok/MeasureThat.net/issues" data-precheck="false">MeasureThat.net/Issues</a>
                </p><p><b data-precheck="false">Based on:</b> <a target="_blank" href="https://benchmarkjs.com/" data-precheck="false">Benchmark.js (v2.1.1)</a>
                </p><p>
                    <b data-precheck="false">Facebook page:</b> <a target="_blank" href="https://www.facebook.com/MeasureThat.Net" data-precheck="false">https://www.facebook.com/MeasureThat.Net</a>
                </p>
                <p>
                    <b data-precheck="false">Open the </b> <a target="_blank" href="/Home/Changelog" data-precheck="false">changelog</a>
                </p>
                <style data-precheck="false">.bmc-button img{width: 27px !important;margin-bottom: 1px !important;box-shadow: none !important;border: none !important;vertical-align: middle !important;}.bmc-button{line-height: 36px !important;height:37px !important;text-decoration: none !important;display:inline-flex !important;color:#ffffff !important;background-color:#BB5794 !important;border-radius: 3px !important;border: 1px solid transparent !important;padding: 1px 9px !important;font-size: 22px !important;letter-spacing: 0.6px !important;box-shadow: 0px 1px 2px rgba(190, 190, 190, 0.5) !important;-webkit-box-shadow: 0px 1px 2px 2px rgba(190, 190, 190, 0.5) !important;margin: 0 auto !important;font-family:'Cookie', cursive !important;-webkit-box-sizing: border-box !important;box-sizing: border-box !important;-o-transition: 0.3s all linear !important;-webkit-transition: 0.3s all linear !important;-moz-transition: 0.3s all linear !important;-ms-transition: 0.3s all linear !important;transition: 0.3s all linear !important;}.bmc-button:hover, .bmc-button:active, .bmc-button:focus {-webkit-box-shadow: 0px 1px 2px 2px rgba(190, 190, 190, 0.5) !important;text-decoration: none !important;box-shadow: 0px 1px 2px 2px rgba(190, 190, 190, 0.5) !important;opacity: 0.85 !important;color:#ffffff !important;}</style><link href="https://fonts.googleapis.com/css?family=Cookie" rel="stylesheet" data-precheck="false"><a class="bmc-button" target="_blank" href="https://www.buymeacoffee.com/2DBtw96"><img src="https://bmc-cdn.nyc3.digitaloceanspaces.com/BMC-button-images/BMC-btn-logo.svg" alt="Buy me a coffee" data-precheck="false"><span style="margin-left:5px" data-precheck="false">Buy me a coffee</span></a>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal" data-precheck="false">Close</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="authenticateModal" tabindex="-1" role="dialog" aria-labelledby="authenticateModal-label" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" data-precheck="false">×</button>
                <h4 class="modal-title" id="authenticateModal-label" data-precheck="false">Log in:</h4>
            </div>
            <div class="modal-body" style="text-align: center">
                
<section data-precheck="false">
</section>
<section>
    <a class="btn btn-primary" href="/Account/Login" data-precheck="false">Sign in with local account</a>
</section>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal" data-precheck="false">Cancel</button>
            </div>
        </div>
    </div>
</div>




<script data-precheck="false">
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-83528903-1', 'auto');
  ga('send', 'pageview');

</script>
<script src="https://cdn.trackjs.com/agent/v3/latest/t.js" data-precheck="false"></script>
<script data-precheck="false">
window.TrackJS && TrackJS.install({ 
    token: "028f6a1c03774007a7b40f656ca7ef3a"
    // for more configuration options, see https://docs.trackjs.com
});
</script>
<script async="" src="https://cdn.requestmetrics.com/agent/current/rm.js" data-rm-token="k4pi6hu:f2xb6eb" data-precheck="false"></script>


<style type="text/css">
:root{
    --fileIconPostAll :url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyBmaWxsPScjZDgzYjNiJyB3aWR0aD0iNzAwcHQiIGhlaWdodD0iNzAwcHQiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDcwMCA3MDAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiA8cGF0aCBkPSJtMTA1IDB2NTYwaDQ1NXYtMzg1aC0xNzV2LTE3NXptMzE1IDB2MTQwaDE0MHoiLz4KPC9zdmc+Cg==');
    --iconGoggle : url("chrome-extension://fgbnfgkceoofgcfedncdgpalnlgcploa/images/google_Icon.webp")
}</style><div style="background-color: rgb(255, 255, 255); border: 1px solid rgb(204, 204, 204); box-shadow: rgba(0, 0, 0, 0.2) 2px 2px 3px; position: absolute; transition: visibility 0s linear 0.3s, opacity 0.3s linear 0s; opacity: 0; visibility: hidden; z-index: 2000000000; left: 0px; top: -10000px;"><div style="width: 100%; height: 100%; position: fixed; top: 0px; left: 0px; z-index: 2000000000; background-color: rgb(255, 255, 255); opacity: 0.05;"></div><div class="g-recaptcha-bubble-arrow" style="border: 11px solid transparent; width: 0px; height: 0px; position: absolute; pointer-events: none; margin-top: -11px; z-index: 2000000000;"></div><div class="g-recaptcha-bubble-arrow" style="border: 10px solid transparent; width: 0px; height: 0px; position: absolute; pointer-events: none; margin-top: -10px; z-index: 2000000000;"></div><div style="z-index: 2000000000; position: relative;"><iframe title="recaptcha challenge expires in two minutes" src="https://www.google.com/recaptcha/api2/bframe?hl=en&amp;v=M-QqaF9xk6BpjLH22uHZRhXt&amp;k=6LezciITAAAAAM8yvrfrR23FDpltM8Luz9QB_8O0" name="c-ah32scue0a5s" frameborder="0" scrolling="no" sandbox="allow-forms allow-popups allow-same-origin allow-scripts allow-top-navigation allow-modals allow-popups-to-escape-sandbox" style="width: 100%; height: 100%;"></iframe></div></div></body>
Tests:
TreeWalker
var div = document.body; var treeWalker = document.createTreeWalker( div, NodeFilter.SHOW_ELEMENT, ); while(treeWalker.nextNode()) { console.log(treeWalker.currentNode.nodeValue.trim()); }
querySelectorAll
const list = document.body.querySelectorAll('*');