排序算法可视化
用柱状动画逐步回放冒泡、选择、插入、归并、快速、堆排序：可调速度、暂停、随机或自定义数据，实时显示比较次数、交换次数与复杂度。
浏览器本地运行所有计算都在你的浏览器里完成，数据不会离开本机。
数据与算法
算法在 sorting-visualizer.ts 里以纯函数运行，返回 compare / swap / set 三种操作步骤，界面只是按步骤回放；随机数来自浏览器 crypto。
可视化
5 1 9 3 7 2 8 4
25130最好 O(n) · 平均 O(n²) · 最坏 O(n²) · 额外空间 O(1) · 稳定排序
这个工具能做什么
- 讲算法课时按步骤播放：冒泡、选择、插入、归并、快速、堆排序都是同一种「比较 / 交换 / 写入」步骤模型，方便横向对比谁在什么时候动了数据。
- 验证「快排最坏是 O(n²)」这类结论：把已排好序的数据交给快速排序，比较次数会明显飙升，而同样的数据在归并排序上几乎没有变化。
- 调算法性能时先数步骤：比较次数、交换次数、写入次数都能直接读出来，比只测耗时更能说明瓶颈在哪一步。
- 手上有一段自己写的排序，想先拿标准实现跑一遍同一份数据，看看步骤序列是不是同一个量级。
示例
输入
数据 5, 1, 9, 3, 7, 2, 8, 4（默认值），算法选冒泡排序
输出
比较 25 次、交换 13 次、写入 0 次，共 38 步，排序结果 1 2 3 4 5 7 8 9
冒泡排序完全逆序时交换次数正好是 n(n-1)/2；这里数据是打乱的，所以只有 13 次交换。归并排序同一份数据是「比较 17 次、交换 0 次、写入 24 次」，代价记在写入上。
常见问题
为什么比较次数和我自己数的不一样？
因为这里统计的是「执行过的每一次比较」，包括判断失败的那一次（例如插入排序里发现前一个元素已经不大于当前元素时的那次比较），也包含冒泡排序提前退出前的那一轮无交换扫描。所以数字通常比只数成功比较要大，但更接近真实执行代价。
归并排序为什么交换次数是 0？
归并排序不交换元素，它把两段合并结果依次写回原数组，所以工具把这类操作记成写入（set）而不是交换（swap）。同一份 8 个元素的数据，归并是 17 次比较加 24 次写入；堆排序则是用交换完成的，交换次数反而更多。
快速排序真的会退化吗？
会。本工具用的是「取最后一个元素做基准」的 Lomuto 分区，输入已经有序或完全逆序时每次分区都只切出一个元素，递归深度变成 n，比较次数退化到 O(n²)。想避开这一点，实际工程里会随机选基准或用三数取中。
动画能关掉吗？
能。系统开启「减少动态效果」（prefers-reduced-motion）时，工具不逐帧播放，而是直接把最终结果和全部统计数字显示出来；也可以随时点「跳到末尾」看结果、点「上一步 / 下一步」手动单步。
最多能放多少个数字？
2 到 64 个整数。每一步都会保存一份数组快照，元素越多、步数越长占用的内存越大，64 个元素已经是几千份快照的量级，再多就会明显卡顿。数据里可以包含负数和重复值。
关键词：sorting visualizersorting algorithmbubble sortquick sortmerge sortheap sortalgorithm animation排序算法可视化冒泡排序快速排序归并排序堆排序算法动画比较次数