Adaptive Bitrate Streaming 2D: Buffer & Ladder Simulator
2D top-down simulator of the buffer-based (BBA) and throughput-based adaptive-bitrate algorithms that mobile EdTech apps use to stream lecture video: watch the segment buffer fill and drain on a live canvas diagram, the quality ladder shift, and rebuffer stalls appear under different mobile network conditions, with drag-to-pan and scroll-to-zoom.
Every mobile learning app that streams lecture video — Coursera, Khan Academy, Udemy — runs an adaptive-bitrate (ABR) algorithm that decides which quality segment to fetch next, purely from the state of a short local buffer and the measured network throughput. This 2D simulator draws that buffer as a live stack of video segments on a flat diagram: watch it fill from a network tower, drain as the lecture plays, and reshuffle its quality ladder in real time as you switch between the buffer-based (BBA) and throughput-based adaptation strategies under stable, fluctuating, or degrading mobile network conditions — with rebuffer stalls counted exactly as a real player would count them. Drag to pan the diagram and scroll or pinch to zoom in on any part of it.
A 2D top-down diagram of the buffer-based (BBA) and throughput-based adaptive-bitrate algorithms mobile EdTech apps use to stream lecture video: a segment stack fills from a network tower and drains as the lecture plays, a quality-ladder highlight shows which rung is active, and rebuffer stalls are counted live under stable, fluctuating or degrading mobile network conditions. Drag to pan and scroll to zoom the diagram.
2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install