Firefox canvas demos

Mozilla Firefox 1.5 introduces the <canvas> drawing tag to play with. Apple's Safari browser already supports it, but until the strangely popular Internet Explorer does too it will have only limited usefulness. Nevertheless, that's no reason not to experiment.

After a brief play, I came up with some fractal examples.

• The Mandelbrot set


• The Mandelbrot set with colour cycling - click with the left mouse button to stop the cycling. This turned out to be pretty CPU intensive.


• The Mandelbrot set with fast colour cycling. As before, but instead of drawing each pixel, identical-coloured pixels are amalgamated into lines just prior to each frame.


• The Mandelbrot set with even faster colour cycling. As with the previous one, but with the amalgamation done once, prior to all drawing. This simple run-length encoding of the image makes it a lot faster, so I was able to set the frame rate higher without overloading the CPU.

Perhaps with universal browser support this will replace Flash. It's certainly much easier for a competent HTMLer to work with, with a minimal learning curve compared to any of the Flash creation languages.

Update 16 June 2006: Flame demo added.

Update 21 June 2006: Fractal zoom demo added.