Lately I have been going through Cormen et. al's Introduction to Algorithms, otherwise known as CLRS, as a way to keep my fundamentals sharp. Inspired by this bl.ocks of merge sort, I thought I would code up some d3 animations of the 5 basic comparison sorts that CLRS covers.
A technical disclaimer: while I tried to normalize what counted as an "action" for the purposes of this animation, and while we uniformly update one "action" per sort per tick, that still doesn't show the true performance difference of the algorithms. For instance, bubblesort is usually slower in practice than insertion sort because of many wasted comparisons, but the animations will show them as similar because they only show swaps as actions. But, this is still neat and a little instructive.