Home▸Computer Science▸Adaptive Bitrate Streaming Simulator (2D)

Adaptive Bitrate Streaming Simulator (2D)

Interactive 2D simulator of adaptive bitrate (ABR) video streaming: watch buffer-based and throughput-based algorithms pick quality levels as network bandwidth fluctuates, tune ABR aggressiveness, and track live buffer, bitrate, and rebuffer stats on a real-time throughput graph.

Computer Science2DModerate60 FPS📱 Mobile-adapted⇄ 3D version

Details

CategoryComputer Science

RenderingCanvas 2D

DifficultyModerate

Target FPS60

ControlsSliders set base bandwidth (Mbps), network jitter (%), buffer cushion target (s), and ABR aggressiveness (throughput safety margin, %); Buffer-based/Throughput-based algorithm toggle, a network-drop button that cuts bandwidth to ~15% for 5 seconds, and a Restart playback button.

adaptive bitratevideo streamingabr algorithmnetwork simulationbuffering2dcomputer science

Related simulations

Hash Function Avalanche VisualizerInteractive 3D bit-grid where flipping a single input bit shows how a cryptographic hash's…

Merkle Tree Proof VisualizerInteractive 3D binary hash tree where selecting a leaf and generating its proof path shows…

CPU Scheduling Policy SimulatorInteractive 3D process queue where switching between FCFS, SJF, priority and round-robin… ⊞ All 333 in Computer Science →

Every mobile video app — YouTube, Netflix, TikTok — plays video that arrives as a stream of short segments, each of which can be requested at a different quality level. This 2D companion simulator models that pipeline directly on a flat canvas: a fluctuating (and sometimes collapsing) simulated network feeds a segment downloader, an adaptive bitrate controller picks the quality for each upcoming segment, and a client buffer drains at real-time playback speed while a live throughput graph traces the network trace underneath. Switch between a buffer-based controller (which reacts purely to how full the buffer is) and a throughput-based controller (which reacts to a moving average of measured download speed and a tunable aggressiveness margin), then trigger a network drop and watch which one keeps playback smooth and which one stalls.

⚙ Under the hood

A 2D canvas simulator of adaptive bitrate (ABR) video streaming, where buffer-based and throughput-based controllers pick quality levels as simulated network bandwidth fluctuates and a live graph tracks throughput, buffer level, and rebuffer stalls.

adaptive bitratevideo streamingabr algorithmnetwork simulationbuffering2dcomputer science

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install