RayJS (2022 Refresh)

Use the WASD keys to move around and explore.

A fun little implementation of an old-school ray casting engine using HTML5 and Javascript. Originally created in 2014, this version is a 2022 refresh with a number of bug and performance fixes.

Early first person games (most notably Wolfenstein 3D) used ray casting to give the illusion of 3D perspective before computer hardware could handle true 3D graphics.

Now days ray casting is actually one of the least efficient ways to achieve this visual effect, but its simplicity makes it a great learning tool.

As the performance of direct pixel manipulation remains poor in Canvas2D, this implementation uses drawImage() for textures and therefore (like Wolfenstein 3D) is limited to textured walls only.

Should work in most modern browsers, having been tested in:

Chrome 104.0.5112, Edge 104.0.1293, and Firefox 104.0.1