Boids Flocking Simulation

physicswasmrustemergenceflocking

Emergent Flocking Behavior

This simulation demonstrates how complex flocking behavior emerges from just three simple rules applied to individual agents. Originally developed by Craig Reynolds in 1986, the “boids” algorithm shows how lifelike group movement patterns arise without centralized coordination.

Loading simulation...
Boids: 200

Click and drag to attract boids. Shift + drag to repel them.

The Three Rules

Each boid follows these local rules based only on nearby neighbors:

  1. Separation - Steer to avoid crowding local flockmates

    • Boids maintain personal space by moving away from neighbors that get too close
    • Prevents collision and clustering
  2. Alignment - Steer towards the average heading of local flockmates

    • Boids match the velocity of their neighbors
    • Creates coordinated group movement
  3. Cohesion - Steer to move towards the average position of local flockmates

    • Boids are attracted to the center of mass of nearby boids
    • Keeps the flock together

From Simple Rules to Complex Behavior

The fascinating aspect of flocking is that no boid has global knowledge or follows a leader. Each agent only responds to its immediate neighbors using simple vector math. Yet collectively, the emergent behavior exhibits:

  • Coordinated group turning and maneuvering
  • Dynamic flock splitting and merging
  • Natural-looking avoidance patterns
  • Stable group cohesion

This demonstrates a key principle in complex systems: simple local interactions can generate sophisticated global patterns.

Technical Implementation

Performance Optimization:

  • Spatial grid partitioning reduces neighbor queries from O(n²) to O(n)
  • Rust/WASM provides near-native performance in the browser
  • Interleaved data structures improve cache locality
  • Can handle thousands of boids at 60fps

Stack:

  • Rust - Core physics simulation with spatial partitioning
  • WebAssembly - Browser execution at native speeds
  • Canvas 2D - Triangle rendering for each boid
  • React - Interactive controls and state management

Multiple Flocks

This implementation supports multiple flocks (shown in blue and pink) that:

  • Follow the same flocking rules within their group
  • Ignore boids from other flocks when calculating behavior
  • Can pass through each other without alignment

This allows observation of how different groups maintain separate identities while sharing the same space.

Interaction

Click and drag anywhere on the canvas to apply repulsive force. Watch how the flocks respond:

  • Individual boids scatter from the force
  • The separation rule kicks in strongly near your cursor
  • The flock quickly reforms using cohesion and alignment
  • Emergent patterns appear in how the group flows around disturbances

Parameters

Experiment with the controls to see how each rule affects behavior:

  • Perception Radius - How far each boid can see
  • Separation Distance - Personal space boundary
  • Max Speed - Speed limit for all boids
  • Rule Weights - Relative strength of each flocking rule

Try:

  • Zero separation → dense clustering
  • Zero alignment → chaotic swirling
  • Zero cohesion → boids drift apart
  • High separation → dispersed, jittery movement

From Python to WASM

This is a complete rewrite of my original Python boids implementation that barely ran on iPad. The Rust/WASM version achieves:

  • 100x+ performance improvement
  • Smooth 60fps with 2000+ boids (vs ~50 boids in Python)
  • Spatial partitioning for efficient neighbor queries
  • Zero garbage collection pauses

References

Based on Craig Reynolds’ seminal 1986 paper:

Reynolds, C. W. (1987). Flocks, herds and schools: A distributed behavioral model. Computer Graphics, 21(4), 25-34.

The boids algorithm has applications in:

  • Computer graphics and animation
  • Robotics swarm coordination
  • Traffic simulation
  • Understanding biological systems
  • Game AI and crowd simulation