Building a Spatial Grid Particle System in Flutter Web

I recently built my developer portfolio entirely in Flutter Web. Instead of using a template, I wanted something with real engineering depth — cinematic backgrounds, interactive particles, and proper architecture. The most interesting technical challenge was the particle system. Here's how I solved the performance problem. The Problem: O(n²) Neighbor Lookups A constellation particle effect draws connecting lines between nearby particles. The naive approach checks every pair: // O(n²) — kills performance at 50+ particles for (var i = 0; i < particles.length; i++) { for (var j = i + 1; j < particles.length; j++) { if (distance(particles[i], particles[j]) < threshold) { drawLine(particles[i], particles[j]); } } } With 100 particles, that's 4,950 distance checks per frame. At 60fps, it's choppy. The Solution: Spatial Grid Hashing Divide the viewport into cells. Each particle registers in its cell. To find neighbors, only check the 9 surrounding cells: final class _SpatialGrid { fi