DISTRIBUTED SYSTEMS · VISUALIZATION LAB

分布式系统可视化实验室

通过 8 个交互式模块,可视化探索分布式系统的核心机制:从 Raft/Paxos 共识、两阶段提交,到一致性模型、CRDT、领导者选举、脑裂仲裁与 Redlock 分布式锁。每个模块均包含 SVG 动画、实时控件与状态统计,零外部依赖,单文件运行。

8 Modules SVG + Vanilla JS Zero Dependencies Single File
01CONSENSUS · RAFT

Raft 共识算法

可视化 Raft 的领导者选举与日志复制。集群包含 5 个节点,任期(Term)递增,领导者通过心跳维持权威,日志条目从领导者传播到所有跟随者并提交。

集群拓扑与日志复制
02CONSENSUS · PAXOS

Paxos 协议

可视化经典 Paxos 多阶段协议:Proposer 发起 Prepare,Acceptors 回复 Promise,随后 Accept 与 Accepted 完成值选定,Learners 学习最终结果。多数派(Quorum)保证一致性。

Prepare / Promise / Accept 流程
03TRANSACTIONS · 2PC/3PC

分布式事务 (2PC/3PC)

可视化两阶段提交与三阶段提交。协调者(Coordinator)向参与者(Participants)发起 Prepare 投票,根据结果执行 Commit 或 Abort。可切换 2PC/3PC 模式并触发参与者故障。

协调者-参与者提交流程
04CONSISTENCY MODELS

一致性模型

在副本时间线上对比 Strong、Sequential、Causal、Read-Your-Writes、Eventual 五种一致性模型。写入操作在不同一致性级别下以不同速度传播,读取可见性与延迟随之变化。

副本时间线与读可见性
05CRDT · CONFLICT-FREE

CRDT 无冲突复制数据类型

可视化 G-Set(只增集合)在 3 个副本上的并发操作与合并。CRDT 保证合并始终收敛且无冲突,任何副本顺序合并结果一致。可切换 PN-Counter 与 LWW-Register 视图。

三副本 G-Set 合并
06LEADER ELECTION

领导者选举

对比 Bully(霸道)算法与 Ring(环)算法。Bully 中高 ID 节点压制低 ID 节点;Ring 中选举消息沿环单向传递。可崩溃当前领导者并触发新一轮选举,观察消息传播。

Bully / Ring 选举动画
07SPLIT-BRAIN · QUORUM

脑裂与仲裁

网络分区将集群一分为二。拥有多数派(Quorum, N/2+1)的一侧可继续提供服务,少数派一侧必须停止写入以避免脑裂。滑动分区位置,观察两侧规模与脑裂风险。

网络分区与多数派
08DISTRIBUTED LOCK · REDLOCK

分布式锁 (Redlock)

可视化 Redlock 算法:客户端向 N 个独立 Redis 实例申请锁,仅在获得多数派(N/2+1)且耗时小于 TTL 时才算加锁成功。可调整节点数、触发节点故障,观察租约有效性。

多实例锁获取