A parallel raytracer built with TypeScript and GPU.js (WebGL/GLSL).

GitHub: http://github.com/jin/raytracer

Press W, A, S, D to move the camera around.

Current mode

GPU

FPS

Loading..

Number of spheres

4

Grid dimension

2

The canvas is 640px by 640px. Each canvas object is controlled by a single GPU.js kernel and a single thread is spawned for each pixel to compute the color of the pixel.

Increase the dimensions of the grid to break the canvas up into tiles, so that there are multiple kernels controlling multiple tiles. With this approach, the kernels will run sequentially, computing one canvas after another.

Benchmark

Benchmark the performance of the parallelized GPU and sequential CPU kernels. This will render 30 frames each and compute min, max, median frame rendering durations, and speedups.