Raytracing in one weekend in JavaScript

This is a JavaScript implementatition of a ray tracer inspired on Peter Shirley's book Raytracing in one weekend.

The ray tracer will run in your browser!

The code is available on github. You can find some comments about this implementation on this article.


The biggest caveat is that this page will be clunky slow. Your browser might complain that the page is non-responsive, just wait. I also have reduced anti-aliasing in some cases.

Chapter 1

Here we just test our ability to write to a HTML 5 canvas.

Raytracing a background

A sphere

Surface normals

Multiple objects


No Anti-aliasing

10 rays

Diffuse materials

Gamma correction

Acne removal




Field Of View

Moveable camera

Complete camera

The title image

This will be slow, so it is generated separately. You have to click the button to do it

if you click this, go have a coffee, or a beer.