Multithreaded 60Hz Canvas Physics Simulator

High-Performance Compute Engine

Simulation runs in a dedicated background Web Worker using zero-copy Float32Array transferables.

This interactive application demonstrates non-blocking multithreaded computing on the static web. The entire numerical integration loop runs at 60 Hz inside a background Web Worker, transferring particle position and velocity buffers using zero-copy ArrayBuffer transferables.

Particle Density:

Enable Gravity (0.25G)

Simulation Parameters & Tuning Controls

Kinematic Particle Count

50 pts 1000 pts

Collision Elasticity

Restitution coefficient percentage

Enable Vector Gravitational Field

Applies downward 9.8m/s² acceleration

Fluid Drag Resistance

Applies Stokes drag on boundary collisions

Architectural & Performance Highlights

Review the threading model and zero-copy data pipelines.

Thread Isolation: The main UI thread only handles Canvas 2D rasterization via requestAnimationFrame.
Zero-Copy Memory: Float32Array buffers are transferred directly without JSON serialization overhead.
Fluid 60 FPS: Smooth performance even under heavy DOM load and theme transitions.

Spatial Kinematics & Particle Collision Loop

Simulation Parameters & Tuning Controls

Architectural & Performance Highlights