Mandelbrot Set in JS - Smooth Scroll Zoom & Fixing Floating-Point Precision

This is a follow-up to Mandelbrot Set in JS - Zoom In . In that article we built a Mandelbrot renderer using Canvas and Web Workers, with click-to-zoom. This post covers what broke after ~16 zooms, why it broke (floating-point precision), and how we replaced click zoom with a smooth scroll-based zoom that also lets you zoom back out. The Problem: Everything Turns Black After ~16 Clicks If you played with the previous demo long enough, you noticed something strange: after zooming in about 16 times, the fractal starts looking pixelated, blocky, and eventually the entire canvas turns solid black. This isn't a bug in the Mandelbrot math. The set is infinitely detailed, there's always more structure to see. The problem is in how computers store decimal numbers. Root Cause: JavaScript Numbers Have Limited Precision JavaScript (like most languages) stores all numbers as 64-bit IEEE 754 doubles . This is just the standard format computers use for decimal numbers, and it gives you about 15 to 1