I started to experiment with a technique called “ray marching”, also called “ray casting” or “sphere tracing”. The method is quite new and different from the classic method with 3D vertex models or ray tracing. There is an excellent paper, written by Prof. John C. Hart. You can read it here: zeno.pdf.

For web development, this method opens a whole new world of possibilities!

Some of the advantages are:

  • Write in GLSL, a subset of C, and run native compiled binaries in the browser.
  • Ultra fast loading speed, the whole program is usually less than 4kB.
  • The whole program exists in a single fragment shader.
  • Excellent graphics performance, since the program runs for 100% on the GPU. There is minimal to no interaction with CPU and main memory.
  • Since the 3D model is described by functions only, morphing or repetition of shapes is easy.
  • The code runs in parallel over all GPU cores. On some high-end graphics cards, it runs on over 2000 cores at the same time!

All good things come with a price. The main disadvantages are:

  • Since the language is GLSL, and compiles on the GPU, you cannot use out-of-the-box libraries. Everything has to be written from scratch, like the 3D engine (tracer, mappings, light, etc) and 3D models.
  • You cannot import a mesh. The whole 3D world has to be programmed with analytical functions, called signed distance functions (SDF).
  • Debugging is hard. You cannot printout values of variables to console or step through the code with a debugger like GDB.

Below is a little sketch with I made to try out my first mapping and tracer code. It uses the function
\[
f(x) = ||\vec{x}|| – r
\]
to describe a sphere located at the origin. With a neat trick, by taking the fraction of the distance only, the spheres are repeated infinitely over the whole domain.

Run Full Screen