Many people did fractals renderers in Javasript in 256 bytes, but no one ever made one that zooms and rotate... until today.
Source code
<pre id=B><script>setInterval("for(d='p01?*?:,~.????',C=Math.cos(n-=88),S=Math.sin(n),Y=m=1+C,z=2048;z;Y-=m/16)for(d+='<br>',X=m;--z&63;X-=m/32,d+=d.charAt(k))for(r=i=k=0;++k+r*r+i*i<13;i=t)t=2*r*i-X*C+Y*S,r=r*r-i*i-X*S-Y*C+C-1;B.innerHTML=d",n=9)</script>
Exactly 256 bytes.
And here is a slightly beautified version of the render loop
for(d='p01?*?:,~.????',C=Math.cos(n-=88),S=Math.sin(n),Y=m=1+C,z=2048;z;Y-=m/16)
for(d+='<br>',X=m;--z&63;X-=m/32,d+=d.charAt(k))
for(r=i=k=0;++k+r*r+i*i<13;i=t)
t=2*r*i-X*C+Y*S,
r=r*r-i*i-X*S-Y*C+C-1;
B.innerHTML=d
Not much magic going here. It is rather straight forward implementation of a Mandelbrot fractal renderer with zoom and rotation of the viewport.
Many bytes were wasted to make sure this effect works cross browser.
The one trick I like here and reused many times was to have one line with some kind credits that also serves as a look up table to render the frames.
Feedback
You can find mandelbrot rotozoom on Pouet.net were it was well received after all. However it was my first tiny prod in JavaScript since the 256b.htm contest, and I had a hard time to please every one. On the other hand I learnt some valuable lessons.
Other recent experiments
There are many experiments and projects like MANDELBROT ROTOZOOM to discover other here.
- FRONTFEST MOSCOW It was an honour to be invited to Fronfest Moscow 2017 with the little family to give my first workshop; implementing a Twin-stick shooter using ES6 and Canvas, and to continue my CODE🎙ART series of talks + live coding aiming to inspire new web developer artists. on November 18th, 2017
- VOLTRA VOLTRA: Grinding the Universe, a gritty JavaScript demo, winner of the 1024 bytes demo competition at the Assembly 2017. on August 6th, 2017
- BREATHING EARTH Another take on Nadieh Bremer mesmerizing Breathing Earth visualisation, running at 60fps on a 2D Canvas without libraries or frameworks. on June 26th, 2017
- HYPERSONIC MANDELBULB A hasty invalid JS1k entry using webGL+Audio. Possibly the first one. on March 6th, 2013
- ASAHIKAWA Flyby the city of Asahikawa in 64 bytes. on January 21st, 2007
- TERRA A voxel landscape rendered using a plasma in a valid 480bytes Atari bootsector. TERRA ranked #2 at Outline 2006 on June 6th, 2006
- NEJA My first JavaScript demo, presented at the Assembly 2005 where it ranked #4 on July 30th, 2005
- OOMA The winning bootsector of Outline 2005, featuring two images zooming with experimental music in a valid 480bytes Atari bootsector. on March 30th, 2005
Let's talk
Don't be shy; get in touch by mail, twitter, github, linkedin or pouet if you have any questions, feedback, speaking, workshop or performance opportunity.