The xSortLab Applet

SORTING a list of items -- that is, arranging the items into increasing or
decreasing order -- is a common operation. It is also the most common example in
the "analysis of algorithms," which is the study of computational procedures and of
the amount of time and memory that they require. The xSortLab applet knows five
different sorting methods. It has a visual sorting mode, where you can watch as
sixteen bars are sorted into increasing order. And it has a timed mode, where you
can measure the time it takes to sort a large number of items. The applet is easy to
use (but you probably won't quite get the point of it unless you already know
something about sorting). More information about the applet can be found below.
This applet was originally written by David Eck for use with his introductory
computer science textbook The Most Complex Machine. However, it can also be
used on its own.
For a list of other applets and for lab worksheets that use the applets, see
the index page.
Note, added September 1, 2004: A French translation of this
applet by Tahia Benhaj-Abdellatif has been posted on Interstices, a
non-profit site about Computer Science.)
Note, added May 2, 2010: A Greek translation of this applet by
Christos T. Rodosthenous is now available.
Note, added August 23, 2011: I have written a JavaScript
version of the "Visual Sort" section of this applet.

Visual Sort Mode

The xSortLab applet can display three different panels: a panel for "Visual Sort," a
panel for "Timed Sort," and a "Log" panel. There is a pop-up menu at the top of the
applet that can be used to switch among the three panels. (Note: Changing panels
while a sort is in progress will abort the sort.)
The applet starts in "Visual Sort" mode, in which 16 bars are sorted step-by-step
using one of the sorting algorithms Bubble Sort, Selection Sort, Insertion Sort,

Merge Sort, or QuickSort. Below the area where the bars are displayed are two
message areas, which display a running commentary when a sort is in progress. The
lower message area displays a detailed comment on each step in the sort. The upper
area displays more general messages about major phases in the sort. (The lower
message area is not used when the sort is being run at "Fast" speed.)
To the right of the bars is a column of controls. The first of these is a pop-up menu,
that can be used to select the sorting method. (Again, doing this in the middle of a
sort will abort the current sort.) Next comes a checkbox that can be used to
determine whether or not the sort is done at "Fast" speed. When this box
is not checked, you get to see a cute animation of moving bars; also, a longer delay
is inserted between steps when you run the sort with the "Go" button. The "Go" and
"Step" buttons are used for executing a sort. The "Start Again" button gives you a
new, randomized list of 16 bars.
Two basic operations are used in sorting: comparing two items to see which is
bigger and copying an item from one place to another. The number of comparisons
and the number of copies used in the current sort are displayed below the controls.

Timed Sort Mode

If you switch to the "Timed Sort" panel, you'll see a large message area, with some
instructions. This panel is used to obtain statistics about the running times of
various running algorithms. The interesting question is how the running time
depends on the number of items being sorted. There is a text-input box at the top of
the panel where you can specify the size of the array that is to be sorted. You can
also specify the number of arrays to be sorted. The point is that a small array takes
so little time to sort that the time cannot be measured accurately. So, you should
sort a number of arrays, all of the same size. You can measure the total time it takes
to sort them all. The time required to sort one array can be obtained by dividing the
total time by the number of arrays. You probably want to adjust the number of
arrays so that the total time is at least a couple of seconds.
Note: Your computer must have enough memory to store all the numbers you want
to sort. (If you are running the applet at all, you probably have enough memory to
work with at least one million items.) If you ask for more numbers than you have
room for, you should just a message telling you that you don't have enough
memory. However, most systems that I have tried this on have crashed. This is a
bug. You are warned. Stick to a reasonable number of items.
At the bottom of the panel are a pop-up menu that you can use to choose the sort
method and a "Go" button that you can click to start the sort. (This changes to
"Abort" while a sort is in progress.)

When you begin a sort, the first thing the computer does is to fill up the arrays with
random numbers. If there are a lot of numbers, this will take a noticeable amount of
time. Then, the computer begins to sort. As the sorting operation proceeds, statistics
are displayed about twice per second. The statistics include the number of
comparison and copy operations that have been performed, the number of arrays
that have been sorted so far, the elapsed time since the computer began sorting, and
the approximate compute time that the computer has devoted to sorting. The
compute time is not the same as the elapsed time, since the applet is doing other
things besides sorting (such as redrawing the screen). The applet tries to use 80% of
the time for sorting, and to leave 20% for other tasks. The applet can measure the
20% of its time that it gives away voluntarily, but if other things are going on in
your computer, it might lose some other time that it can't measure. This is why the
measured compute time is approximate. So, you should nottry to run a timed sort in
the background! Just sit and watch -- or go get a coffee.

The Log
Every time a sort completes successfully, statistics about that sort are written to a
log. For a visual sort, the number of copies and the number of comparisons are
recorded. For a timed sort, all the statistics that are displayed in the "Timed Sort"
panel are written to the log. You can view this log by selecting the "Log" option
from the pop-up menu at the top of the applet.
The Log panel has buttons for clearing the log and for saving it to a file. However,
it is likely that your browser will not permit you to save the log. Unfortunately, the
applet has no provision for printing the log at this time. You might try using copyand-paste to copy the data from the log to another program from which you can
copy or print it.
David Eck (eck@hws.edu), August 1997

Sorting Algorithms
We all know that Quicksort is one of the fastest algorithms for sorting. It's not
often, however, that we get a chance to see exactly how fast Quicksort really is. The
following applets chart the progress of several common sorting algorthms while
sorting an array of data. (This is inspired by the algorithm animation work

at Brown University and the video Sorting out Sorting from the University of
Toronto (circa 1970!).)
This page shows the main sorting algorithms. Variations of these algorithms are
shown here. A version with smaller applets is here.
Bubble Sort
(implemented by James Gosling and
Jason Harrison)

BubbleSort goes through the array repeatedly, exchanging adjacent elements that are in the
wrong order. At the end of each such pass, the largest remaining element has been moved
to its correct location.
Selection Sort
(implemented by Jason Harrison)

SelectionSort divides the array into a sorted portion on the left and an unsorted portion on
the right. It extends the sorted portion by selecting the smallest remaining element from
the unsorted portion and placing it at the end of the sorted portion of the array.
Insertion Sort
(implemented by Jason Harrison)

InsertionSort divides the array into a sorted portion on the left and an unsorted portion on
the right. It extends the sorted portion by inserting the first unsorted element into the sorted
portion, shuffling elements to the right as required to make room for the new element.
Double Storage Merge Sort
(implemented by Jack Snoeyink)

MergeSort divides the array in half, sorts each half recursively, and then merges the two
sorted halves together. It uses an extra array, equal in size to the original, to make merging
efficient. In the animation, you'll see the magenta marker make two passes through the
sorted halves. The first time, nothing appears to happen. This is when the two halves are
being merged into the extra array. The second time through the data is copied from the
extra array back to the original.
Bottom-up Merge Sort
(implemented by Byron Weber Becker)

Bottom-up merge sort begins by merging each pair of 1-element subarrays to make sorted
2-element subarrays. Adjacent pairs of 2-element subarrays are merged to make 4-element
subarrays. Merging adjacent arrays continues until the entire array is sorted. The algorithm
requires a work array, doubling the required storage. It is not recursive.

Shell Sort
(implemented by Jason Harrison)

Shellsort is a simple extension of InsertionSort which gains speed by allowing exchanges

of elements that are far apart. The idea is to rearrange the array to give it the property that
every hth element (starting anywhere) yields a sorted array. Such an array is said to be hsorted. h decreases as the sort runs until, in the last pass, h is 1 and the algorithm is the
same as InsertionSort.
Heap Sort
(implemented by Jason Harrison)

HeapSort is similar to SelectionSort in that it always selects the largest (or smallest)
element from the unsorted part of the array to move to the sorted part of the array.
However, HeapSort first organizes the unsorted part of the array into a heap so that it can
select the largest element quickly. After the largest element is removed, the heap must be
reorganized.
Naive Quick Sort
(implemented by James Gosling and Byron Weber Becker)

Quicksort begins by chooses a pivot. It then puts all the elements that are less than the
pivot on the left end of the array, all the elements greater than the pivot on the right end of
the array, and the pivot between them. The pivot is now in its final position and all the
elements to its left (right) will stay to its left (right). Now recursively sort on the left side
and the right side.
This version chooses the last element as a pivot -- a very poor choice if the data is ordered
or nearly ordered.
Quick Sort
(implemented by James Gosling)

This is like the Naive QuickSort except that it chooses the middle element as the pivot.

If you're going to make a copy of this demo, you'll need to also copy the
the SortAlgorithm class and the SortItem class.
Sorting routines to be added:
Three way merge.
Quicksort with duplicated pivots.
Random Swap sort.

Change History:
James Gosling,
jag@firstperson.c Original demonstration.
om
Jason Harrison,
harrison@cs.ubc. Further modifications, additional sorts. Hosted at
ca
http://www.cs.ubc.ca/spider/harrison/Java/sorting-demo.html.
Jim Boritz,
boritz@cs.ubc.ca
Guido Bunsen
Jean-Luc Duprat

Byron Weber
Becker,
bwbecker@uwate
rloo.ca

Rebuilt this page for Netscape 2.0 and recompiled the applets
with the JDK.

Copied
from http://www.cs.ubc.ca/spider/harrison/Java/ to http://w
ww.cs.uwaterloo.ca/~bwbecker/sortDemo/

reoriented and resized the applets to show more data

added controls to start the applet and specify data order

added counts of comparisons, moves, and other array

accesses and ensured that all algorithms counted
comparable operations (the previous version QuickSort,
for example, didn't count many comparisons in the
partition phase and thus appeared to be substantially
faster than it should have).

refactored the code to use model-view-controller pattern

added bottom-up mergesort