Programming Visualization Demo Gallery

面向自学开发者的算法执行过程可视化入口。先看稳定题目 demo；代码执行工具和实验性页面放在后面。

Recommended / Stable Algorithm Visualizations

主入口。这里的页面展示稳定的题目可视化：输入状态、关键步骤、解释句和最终结果。

array + hash map

Two Sum · 两数之和

哈希表补数查找：数组读取、哈希表更新、答案定位。

查看
two pointers

Container With Most Water · 盛最多水的容器

双指针向内扫描：面积计算、短板比较、最大值更新。

查看
linked list

Reverse Linked List · 反转链表

链表箭头逐个反转：保存 next、重连指针、移动游标。

查看
DP table

Climbing Stairs · 爬楼梯

DP 表格填充：读取前两格、递推计算、写入当前格。

查看
DP choose / skip

House Robber · 打家劫舍

动态规划选择：跳过当前房，或偷当前房并接上安全位置。

查看

Learner Tools

用于查看自己代码如何逐行执行。线上页面提供静态示例；交互式运行器需要在本地启动。

code viewer

Code Execution Viewer

逐行查看代码执行过程：locals、return 行、未执行代码和判题结果。

查看示例

Local Interactive Runner 是本地功能，不是线上可直接使用的页面。启动后访问 http://127.0.0.1:8765/。

uv run python -m pv serve --host 127.0.0.1 --port 8765

Experimental / Legacy

这些页面用于动画实验或架构验证，不是当前推荐主入口。

story animation

Story Animation Demo

Two Sum 的空间化动画实验：数组元素、哈希表区域和匹配箭头。

查看实验
runtime-bound

Runtime-Bound Visualization

把真实运行结果绑定到概念卡片的架构验证页面。

查看实验