The Simplicity of 3D Graphics

I have played 3D video games for as long as I can remember. Seeing a fully three-dimensional world rendered onto a two-dimensional monitor always felt like magic to me. That changed when I encountered Tsoding’s video on YouTube, “One Formula that Demystifies 3D Graphics”. In the video, Tsoding programs a very simple 3D renderer from scratch in JavaScript which is capable of rendering, rotating, and translating a cube on the screen. I was so fascinated by the whole process that I decided to build my own 3D renderer and extend it with more features such as near plane line clipping. This paper describes my minimal implementation of a 3D graphics pipeline and the discoveries I made while building it. You can find the source code here. 3D Rendering Process Rendering a 3D object onto a 2D display requires a sequence of transformations to be applied to each point (𝑥, 𝑦, 𝑧) in a scene. This sequence of operations is known as the 3D graphics pipeline. The following describes the full pipeline t