My DemoJS entries.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.


These are my entries for the DemoJS demoparty.

See the demos online

2011 entry v2: How does it work?

The screen is splitted in a grid of squares, and spheres are bucketed in this grid.


  • To render a square, the background is redrawn, then spheres in this square are redrawn back-to-front after z-sort (aka painter algorithm).
  • Because shadowBlur is slow, the shadow is done using gradients.
  • Gradient for all radiuses are precomputed before-hand.
  • Occluded spheres do not get drawn.
  • To save the cost of drawing very small spheres, we draw a small rect instead.
  • Also some of the spheres are precomputed bitmaps because it's faster (but then, no gradients).
  • Squares when nothing happened are left untouched.

2012 entry: How to make a blur in Canvas?

Repeateadly downsize a back-buffer canvas by 2, then blend some of these downsized buffer on the original. The blur here is stateful: I would recommend against it for framerate issues will come up.