Raytracing is computationally expensive, and an interpreted language such as JavaScript is a poor choice for implementing a raytracer. The raytracer below is a proof-of-concept, showing that a raytracer can be implemented in JavaScript.
To avoid long delays before the image becomes visible, the raytracer renders it progressively — the image is first shown at a very low resolution and then at progressively higher resolutions. There are two render options — full render gives a higher quality image, but may cause slower browsers to hang, while basic render stops at three-by-three pixel squares. For maximum compatibility, the image is made up of html <div> elements, with a full render consisting of over 59,000 of these elements.