I make use of Tailspin [1], which is a JS-in-JS interpreter and almost fully ES262 compliant. The visualisation gets called on every line of code and updates itself based on inspecting the interpreter state.
Two benefits are, the visualisation code is kept completely separate from the code being visualised. And secondly Tailspin offers the ability to step back in time.
In terms of creating algorithms, it's a bit of an awkward wiki syntax at the moment, see the tutorial [2] and bubble sort example [3].
There are some great visualisations here. Coming up with good visualisations is tricky. I can't help but mention my own attempt at a more general framework for algorithm visualisation: http://will.thimbleby.net/algorithms/
Two benefits are, the visualisation code is kept completely separate from the code being visualised. And secondly Tailspin offers the ability to step back in time.
In terms of creating algorithms, it's a bit of an awkward wiki syntax at the moment, see the tutorial [2] and bubble sort example [3].
[1] http://wthimbleby.github.io/tailspin/ [2] http://will.thimbleby.net/algorithms/doku.php?id=creating_an... [3] http://will.thimbleby.net/algorithms/doku.php?id=algorithm:b...