JavaScript: DHTML Shell Sort
This page demonstrates the Shell Sort algorithm which appears to be the most efficient algorithm out of the four presented on this site.
That may be due to faults in the implementation of the Quick Sort algorithm (see related link on that page for details), but until that's confirmed you probably want to use the shell sort.
Working Demonstration
| id | colour | random |
|---|---|---|
| 1 | red | 223 |
| 2 | green | 365 |
| 3 | yellow | 913 |
| 4 | purple | 418 |
| 5 | blue | 61 |
| 6 | blue | 54 |
| 7 | blue | 643 |
| 8 | blue | 709 |
| 9 | blue | 945 |
| 10 | red | 901 |
| 11 | red | 93 |
| 12 | green | 190 |
| 13 | green | 913 |
| 14 | blue | 6 |
| 15 | green | 435 |
| 16 | green | 546 |
| 17 | green | 339 |
| 18 | purple | 593 |
| 19 | purple | 333 |
| 20 | blue | 63 |
How does it work?
For a more detailed discussion on the sorting process, you can refer to the Bubble Sort page. The only difference between the two is the actual sorting algorithm, with the Insertion Sort, in theory, being a little bit faster:
// global variables
var col = 0;
var parent = null;
var items = new Array();
var N = 0;
function isort(m, k, desc)
{
for(var j=m+k; j < N; j+= k) {
for(var i=j; i >= k && compare(get(i), get(i-k), desc); i-= k) {
exchange(i, i-k);
}
}
}
function sortTable(tableid, n, desc)
{
parent = document.getElementById(tableid);
col = n;
if(parent.nodeName != "TBODY")
parent = parent.getElementsByTagName("TBODY")[0];
if(parent.nodeName != "TBODY")
return false;
items = parent.getElementsByTagName("TR");
N = items.length;
// shell sort
if((k = Math.floor(N/5)) > 7) {
for(var m=0; m < k; m++) isort(m, k, desc);
}
if((k = Math.floor(N/7)) > 7) {
for(var m=0; m < k; m++) isort(m, k, desc);
}
for(k=7; k > 0; k -= 2) {
for(var m=0; m < k; m++) isort(m, k, desc);
}
}
Interestingly, the Shell Sort algorithm actually makes use of the previously presented Insertion Sort algorithm.
New exchange function
Because the Shell Sort algorithm requires non-adjacent items to be swapped, we need to make some changes to the exchange function that was previously used for both the Bubble Sort and Insertion Sort. The get and compare functions remain unchanged.
function exchange(i, j)
{
if(i == j+1) {
parent.insertBefore(items[i], items[j]);
} else if(j == i+1) {
parent.insertBefore(items[j], items[i]);
} else {
var tmpNode = parent.replaceChild(items[i], items[j]);
if(typeof(items[i]) == "undefined") {
parent.appendChild(tmpNode);
} else {
parent.insertBefore(tmpNode, items[i]);
}
}
}
For an even more advanced sorting technique, see the Quick Sort demonstration.
Related Articles - Sorting Algorithms
- JavaScript DHTML Bubble Sort
- JavaScript DHTML Shell Sort
- JavaScript Sorting Algorithm Comparison
- JavaScript DHTML Quick Sort
- JavaScript DHTML Insertion Sort
- JavaScript DHTML Sorting Using OOP - Example 1
- JavaScript DHTML Sorting Algorithms
- PHP Sorting Arrays of Arrays
- PHP Sorting SimpleXMLElement Object arrays