排序算法演示动画

        写前面两篇排序的时候，百度找图片，看到还比较不错的动图，能够展示数据在内存中的变化。然而性格使然，我会仔细的观察动图，仔细观察的话发现要么是无法较好的展示比较过程，要么是交换的过程与实际代码执行的有一些出入，心想自己做一个效果出来。这一想不要紧，4月30号-5月4号，花了几个晚上时间，终于搞定了俩算法的排序效果动图，这效率低的也是没谁了。

中间的尝试过程，以及遇到的问题，
1，开始用JavaScriptr的canvas，画出了初始化的状态，做到动效觉得会很麻烦，卡住了。
2，咨询前端同事，建议用css，于是改用div，做到动效的时候，仍然卡住，原因是延迟函数执行的效果和预期不一致，大致能猜到js的闭包特性导致。
3，于是想到用Java的canvas直接画出来，于是乎动手，写到动效，又卡住，动效过程中及时渲染没搞定，无奈对API不熟悉，暂时放弃。
4，重新思考div方案中遇到的问题的解决办法，按说，仔细处理一下延迟方法，应该可行，于是再次动手，这次把冒泡的效果做出来了，想着没问题了，接着套入插入排序，然而执行效果又与预期不一致，究其原因发现插入排序中多了break导致，break无法让事先定时的timer取消往下执行，这下又卡住了，带着问题入睡。
5，早上再继续，想到把排序过程和效果分开来写（最开始就是分开写的，过程中觉得直接一边排序一边展示效果更合理，然而后来证明，分开也有分开的好处），这下可以了。

中间遇到问题原因之一是对前端展示部分的代码熟悉程度不够，二是没有整体从开始思考可行的方案，也是因对前端代码的评估过于简单了，只在脑海中想了一下，就觉得没问题。JS的canvas，CSS的动画，Java的Canvas，应该都能实现该效果，这里暂且不深究了，本来的目的也只是想在做排序的时候，可以做出辅助理解的动画效果。


冒泡排序

https://github.com/angelala00/learn/blob/master/src/main/html/sort/bubblesort.html

插入排序

https://github.com/angelala00/learn/blob/master/src/main/html/sort/insertionsort.html