1 Explicit loop vs. 3 implicit loops

JavaScript performance comparison

Test case created

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<table class="myTable">
  <tr>
    <td>Just some text. td #1</td>
  </tr>
  <tr class="hideMe">
    <td>Just some text. td #2</td>
  </tr>
  <tr class="hideMe">
    <td>Just some text. td #3</td>
  </tr>
  <tr>
    <td>Just some text. td #4</td>
  </tr>
  <tr>
    <td>Just some text. td #5</td>
  </tr>
  <tr class="hideMe">
    <td>Just some text. td #6</td>
  </tr>
  <tr>
    <td>Just some text. td #7</td>
  </tr>
  <tr>
    <td>Just some text. td #8</td>
  </tr>
  <tr>
    <td>Just some text. td #9</td>
  </tr>
  <tr>
    <td>Just some text. td #10</td>
  </tr>
  <tr>
    <td>Just some text. td #11</td>
  </tr>
  <tr>
    <td>Just some text. td #12</td>
  </tr>
  <tr>
    <td>Just some text. td #13</td>
  </tr>
  <tr>
    <td>Just some text. td #14</td>
  </tr>
  <tr>
    <td>Just some text. td #15</td>
  </tr>
  <tr class="hideMe">
    <td>Just some text. td #16</td>
  </tr>
  <tr>
    <td>Just some text. td #17</td>
  </tr>
  <tr>
    <td>Just some text. td #18</td>
  </tr>
  <tr>
    <td>Just some text. td #19</td>
  </tr>
  <tr>
    <td>Just some text. td #20</td>
  </tr>
  <tr>
    <td>Just some text. td #21</td>
  </tr>
  <tr>
    <td>Just some text. td #22</td>
  </tr>
  <tr>
    <td>Just some text. td #23</td>
  </tr>
  <tr>
    <td>Just some text. td #24</td>
  </tr>
  <tr>
    <td>Just some text. td #25</td>
  </tr>
  <tr>
    <td>Just some text. td #26</td>
  </tr>
  <tr>
    <td>Just some text. td #27</td>
  </tr>
  <tr>
    <td>Just some text. td #28</td>
  </tr>
  <tr>
    <td>Just some text. td #29</td>
  </tr>
  <tr>
    <td>Just some text. td #30</td>
  </tr>
  <tr>
    <td>Just some text. td #31</td>
  </tr>
  <tr>
    <td>Just some text. td #32</td>
  </tr>
  <tr>
    <td>Just some text. td #33</td>
  </tr>
  <tr>
    <td>Just some text. td #34</td>
  </tr>
  <tr>
    <td>Just some text. td #35</td>
  </tr>
  <tr>
    <td>Just some text. td #36</td>
  </tr>
  <tr>
    <td>Just some text. td #37</td>
  </tr>
  <tr>
    <td>Just some text. td #38</td>
  </tr>
  <tr>
    <td>Just some text. td #39</td>
  </tr>
  <tr>
    <td>Just some text. td #40</td>
  </tr>
</table>
<script>
Benchmark.prototype.setup = function() {
    var $rows = $('.myTable tr:not(.hideMe)');
};
</script>

Preparation code output

Just some text. td #1
Just some text. td #2
Just some text. td #3
Just some text. td #4
Just some text. td #5
Just some text. td #6
Just some text. td #7
Just some text. td #8
Just some text. td #9
Just some text. td #10
Just some text. td #11
Just some text. td #12
Just some text. td #13
Just some text. td #14
Just some text. td #15
Just some text. td #16
Just some text. td #17
Just some text. td #18
Just some text. td #19
Just some text. td #20
Just some text. td #21
Just some text. td #22
Just some text. td #23
Just some text. td #24
Just some text. td #25
Just some text. td #26
Just some text. td #27
Just some text. td #28
Just some text. td #29
Just some text. td #30
Just some text. td #31
Just some text. td #32
Just some text. td #33
Just some text. td #34
Just some text. td #35
Just some text. td #36
Just some text. td #37
Just some text. td #38
Just some text. td #39
Just some text. td #40

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
1 explicit loop
$rows.each(function (i) {
    $(this).toggleClass( 'altRow', !! (i & 1) );
});
pending…
3 implicit loops
$rows
  .removeClass('altRow')
  .filter(':odd')
  .addClass('altRow');
pending…

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

Compare results of other browsers

0 comments

Add a comment