Table sorting stack overflow (v12)

Revision 12 of this benchmark created on


Preparation HTML

<table>
<thead>
<tr>
<th onclick="sort(people, 0, asc1); asc1 *= -1; asc2 = 1; asc3 = 1;">Name</th>
<th onclick="sort(people, 1, asc2); asc2 *= -1; asc3 = 1; asc1 = 1;">Surname</th>
<th onclick="sort(people, 2, asc3); asc3 *= -1; asc1 = 1; asc2 = 1;">Age</th>
</tr>
</thead>
<tbody id="people">
<tr><td>Raja</td><td>Dey</td><td>18</td></tr>
<tr><td>Mamata</td><td>Sharma</td><td>20</td></tr>
<tr><td>Avijit</td><td>Sharma</td><td>21</td></tr>
<tr><td>Sharanya</td><td>Dutta</td><td>26</td></tr>
<tr><td>Nabin</td><td>Roy</td><td>27</td></tr>
<tr><td>Raja</td><td>Dey</td><td>18</td></tr>
<tr><td>Mamata</td><td>Sharma</td><td>20</td></tr>
<tr><td>Avijit</td><td>Sharma</td><td>21</td></tr>
<tr><td>Sharanya</td><td>Dutta</td><td>26</td></tr>
<tr><td>Nabin</td><td>Roy</td><td>27</td></tr>
<tr><td>Raja</td><td>Dey</td><td>18</td></tr>
<tr><td>Mamata</td><td>Sharma</td><td>20</td></tr>
<tr><td>Avijit</td><td>Sharma</td><td>21</td></tr>
<tr><td>Sharanya</td><td>Dutta</td><td>26</td></tr>
<tr><td>Nabin</td><td>Roy</td><td>27</td></tr>
<tr><td>Raja</td><td>Dey</td><td>18</td></tr>
<tr><td>Mamata</td><td>Sharma</td><td>20</td></tr>
<tr><td>Avijit</td><td>Sharma</td><td>21</td></tr>
<tr><td>Sharanya</td><td>Dutta</td><td>26</td></tr>
<tr><td>Nabin</td><td>Roy</td><td>27</td></tr>
<tr><td>Raja</td><td>Dey</td><td>18</td></tr>
<tr><td>Mamata</td><td>Sharma</td><td>20</td></tr>
<tr><td>Avijit</td><td>Sharma</td><td>21</td></tr>
<tr><td>Sharanya</td><td>Dutta</td><td>26</td></tr>
<tr><td>Nabin</td><td>Roy</td><td>27</td></tr>
<tr><td>Raja</td><td>Dey</td><td>18</td></tr>
<tr><td>Mamata</td><td>Sharma</td><td>20</td></tr>
<tr><td>Avijit</td><td>Sharma</td><td>21</td></tr>
<tr><td>Sharanya</td><td>Dutta</td><td>26</td></tr>
<tr><td>Nabin</td><td>Roy</td><td>27</td></tr>
<tr><td>Raja</td><td>Dey</td><td>18</td></tr>
<tr><td>Mamata</td><td>Sharma</td><td>20</td></tr>
<tr><td>Avijit</td><td>Sharma</td><td>21</td></tr>
<tr><td>Sharanya</td><td>Dutta</td><td>26</td></tr>
<tr><td>Nabin</td><td>Roy</td><td>27</td></tr>
<tr><td>Raja</td><td>Dey</td><td>18</td></tr>
<tr><td>Mamata</td><td>Sharma</td><td>20</td></tr>
<tr><td>Avijit</td><td>Sharma</td><td>21</td></tr>
<tr><td>Sharanya</td><td>Dutta</td><td>26</td></tr>
<tr><td>Nabin</td><td>Roy</td><td>27</td></tr>
<tr><td>Raja</td><td>Dey</td><td>18</td></tr>
<tr><td>Mamata</td><td>Sharma</td><td>20</td></tr>
<tr><td>Avijit</td><td>Sharma</td><td>21</td></tr>
<tr><td>Sharanya</td><td>Dutta</td><td>26</td></tr>
<tr><td>Nabin</td><td>Roy</td><td>27</td></tr>
</tbody>
</table>
</body>

Setup

var tbody, asc1 = 1,
    asc2 = 1,
    asc3 = 1;
  tbody = document.getElementById("people");

Test runner

Ready to run.

Testing in
TestOps/sec
New
var asc = 1,
  col = 0;
var rows = tbody.rows,
  rlen = rows.length,
  arr = new Array(),
  i, j, cells, clen;
// fill the array with values from the table
for (i = 0; i < rlen; i++) {
  cells = rows[i].cells;
  clen = cells.length;
  arr[i] = new Array();
  for (j = 0; j < clen; j++) {
    arr[i][j] = cells[j].innerHTML;
  }
}
// sort the array by the specified column number (col) and order (asc)
arr.sort(function(a, b) {
  return (a[col] == b[col]) ? 0 : ((a[col] > b[col]) ? asc : -1 * asc);
});
for (i = 0; i < rlen; i++) {
  arr[i] = "<td>" + arr[i].join("</td><td>") + "</td>";
}
tbody.innerHTML = "<tr>" + arr.join("</tr><tr>") + "</tr>";
ready
Old
var asc = 1,
  col = 0;
var rows = tbody.rows,
  rlen = rows.length,
  arr = new Array(),
  i, j, cells, clen;
// fill the array with values from the table
for (i = 0; i < rlen; i++) {
  cells = rows[i].cells;
  clen = cells.length;
  arr[i] = new Array();
  for (j = 0; j < clen; j++) {
    arr[i][j] = cells[j].innerHTML;
  }
}
// sort the array by the specified column number (col) and order (asc)
arr.sort(function(a, b) {
  return (a[col] == b[col]) ? 0 : ((a[col] > b[col]) ? asc : -1 * asc);
});
// replace existing rows with new rows created from the sorted array
for (i = 0; i < rlen; i++) {
  rows[i].innerHTML = "<td>" + arr[i].join("</td><td>") + "</td>";
}
ready

Revisions

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