Mandelbrot.site is an interactive fractal viewer that runs in your web browser. It offers a fast and intuitive way to explore the Mandelbrot set and share your discoveries. This website is built with Rust, WebAssembly, TypeScript, and Leaflet.js.
As seen in: Hacker News • Creative Machine • Science News magazine
Mandelbrot.site allows you to discover the Mandelbrot set through intuitive zoom controls using scrolling or region selection, while viewport coordinates continuously track your position on the complex plane.
The visualization experience can be customized by adjusting the iteration count or resolution settings for varying levels of detail, switching between color palettes to reveal different structures, and even exploring multibrot sets by changing the exponent parameter.
Beyond exploration, this web app allows you to share discoveries with high-resolution image downloads and shareable URLs that preserve exact locations and zoom levels, enabling others to access and experience the fractal views you found.
Example images generated with Mandelbrot.site:
Mandelbrot.site uses a WebAssembly-based architecture for high-performance fractal computation in the browser. The computational backend is implemented in Rust for performance and safety. This Rust code is compiled to WebAssembly (Wasm) using the wasm-pack plugin, allowing fast computations directly in the browser. The frontend uses TypeScript for type safety and Leaflet.js to render the Mandelbrot set tiles in a zoomable, map-like interface.
Performance is optimized using Web Workers via the threads.js library. This prevents computations from blocking the main browser thread by creating a pool of workers that generate Mandelbrot set tiles in parallel. The "rectangle checking" optimization reduces computation time for areas entirely within the set by checking only the perimeter of a tile.
The site is a Progressive Web App (PWA), using Service Workers for offline functionality and reduced network dependencies.
This project requires Node.js and Rust to be installed on your system. Check the client/.nvmrc file for the recommended Node.js version. Development scripts are available in client/package.json.
A complete guide can be found in CONTRIBUTING.md.
| Name | GitHub Profile | |
|---|---|---|
| Ross Hill | rosslh | |
| Joseph Weissman | jweissman | |
| Shubhankar Shandilya | shubhankar-shandilya-india |
Want to contribute? Check out the list of open issues and read our contributing guidelines.