Hey everyone!
We all love 3Blue1Brown's animations and Ben Eater’s interactive demos, but local Manim rendering is slow, and web solutions are usually too heavy.
Could we use stock Manim code directly in the browser with real-time interactivity, while keeping things lightweight? I think I've found a way!
3b1b's classic Fourier transform animation recreation in wanim playground
You can check out examples at gallery, or play with it and share your creations at playground. Over at here, I recreated 3b1b's classic Fourier transform animation. After the initial animation plays, you can drag the slider to change the winding frequency and watch the live updates yourself.
Several great projects have brought Manim to the web, but they either require rewriting code in JavaScript or loading a bulky Pyodide environment.
My idea was to treat Manim code as a DSL and transpile it into JS while keeping the API compatible. It sounded crazy, but it works! more info
|
manim-web |
studio.academa.ai (manimgx) |
try.manim.community (jupyter notebook) |
Wanim (This project) |
| Runs the original manim Python code |
❌ |
✅ |
✅ |
✅ |
| Lightweight, embeddable anywhere |
✅(~1M) |
❌(~26M) |
❌(request backend server) |
✅ |
| Real-time rendering in the browser |
✅ |
✅ |
❌ |
✅ |
| Interactive demos and slides |
❌ |
❌ |
❌ |
✅ |
Thanks to its compact footprint, scenes can be embedded anywhere via web components and other formats. Looking ahead in this AI era, I also envision Manim code serving as a real-time blackboard for AI to explain concepts to people!
Huge thanks to Grant Sanderson and the Manim community, to Ben Eater, and to pioneer projects like manim-web. Also, special thanks to my good friends OpenCode Go and DeepSeek for their help throughout this complex engineering journey, which helped make all of this possible!
I’m eager to hear your feedback and see your creativity unleashed!
Github Repo: https://github.com/Acfboy/Wanim
Website: https://wanim.org/