Modihfy
Link to open source: https://github.com/Prasoon-Rai/modihfy
Link to Live Project: https://modihfy.vercel.app
The algorithm splits the give image into individual pixels and finds the optimal way to arrange them into modi's picture
Detailes (For Nerds):
1. Web Workers for the Heavy Lifting: Calculating the physics (velocity, steering, collision) for thousands of particles on every single frame is expensive. If we did that on the main browser thread, your UI would freeze up. Instead, we offload all that intense math to a Web Worker running in the background.
2. WebGL for Rendering: HTML Canvases are cool, but WebGL (powered by your GPU) is where the real speed is. We take the positions generated by our Web Worker and hand them over to WebGL to draw the thousands of particles at 60 frames per second effortlessly.
3. The "Boids" Algorithm: We don't just move pixels in straight lines. We use a flocking algorithm (often called Boids simulation). Particles behave like a flock of birds—they steer towards their destination while avoiding crowding each other and matching the velocity of their neighbors. This gives the morphing effect a very fluid, dynamic, and organic feel.
4. GIF Encoding on the Fly: Using the gifenc library, we capture the frames rendered by WebGL in real-time, compress them, and compile them into an animated GIF right in your browser. No server required!
