Do We Live In the Matrix?
Tags: 3d, design, writing, webgl
Published: 2022-01-17 22:26:02


Allow me to introduce you to the beautiful world of 3D rendering, by posing a simple question - do we live in the "real" world? 

Whether or not we experience true meaning in our daily experiences has been the topic of countless metaphysical or philosophical discussions.  But, I don't really care about that, neither do I know a lot about it - but what I do know, is how we can rebuild the world around us on the computer.  

Let's begin with a simple assumption: the world we live in is truly, deeply, (rather madly) a giant computer simulation.  

# Part 1: You're Smooth!

Behold, the humble circle:

![circle lol](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mqxq6d7weh7h0zvc0vs7.png)
 
This shape with infinite sides, at least as you perceive on your device, is not truly a circle.  If you were to zoom in - go ahead, I'll wait - 

![zoomed in circle](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/oex97hzd3bb2itedrm4c.png)
 
You'll see that this "circle" is actually a set of squares.  This conversion of curved things, etc into a bunch of pixels is what's called "rasterization."  Early in the study of making realistic 3D scenes on a computer, everything, and I mean EVERYTHING was governed by raster engines.  3D renderers on browsers like [THREE.js](https://threejs.org) are built on top of WebGL, which is a [rasterizer](https://webgl2fundamentals.org/webgl/lessons/webgl-fundamentals.html) capable only of drawing 2d stuff.  Making our 2D drawings look 3D is a whole other article!  

But for now, look closely at anything around you that isn't on your computer, such as, say, your arm.  Look REALLY close!  Are you seeing pixels yet?  Grab a magnifying glass or a pocket microscope and take a good look at anything.  If everything around you is dissolving into squares, close Minecraft.  Otherwise, keep reading!

# Part 2 - But Not Too Smooth

Just because you can zoom in forever and see smoothness doesn't immediately prove that what you're seeing is super real - it's possible that your surroundings are just super high resolution.  For example, to see the pixels on a 16k monitor, you would *probably* need a microscope or magnifying glass to identify the pixels.  

So, take a look at this: 

![donut](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9rru89pqq4zhg9i28u0y.png)

If you know where this is from, congratulations!  Click all the reactions in the side, if you haven't already.  In any case...
Ah, what beauteous smoothness!  So smooth, like if you bit into it, your teeth would slide right off its plastic exterior.  There is nothing in this world so perfectly and uniformly smooth like this, even plastic items, or Teflon.  

However, imperfections are easy to make - things like [Perlin noise](https://en.wikipedia.org/wiki/Perlin_noise) are the bread and butter of CGI.  In fact: 

![final donut](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2r0htvkiiub6p7p6b2pc.png)
 
This donut has been given a plush, extremely unhealthy texture thanks some magic involving noise textures.  

So these fresh donuts near you may very well be high resolution rendered images.  So that's why its time to do some mirror gazing.

# Part 3: Oh Looking Glass...

Do you have a mirror nearby?  Anything shiny and reflective, like a phone screen?  If you do, you'll notice that not only do reflective surfaces show you your beauteous visage, they also throw back a little bit of light.  However, with a rasterizer, mirrors are only capable of showing an accurate reflection - they can't show all the light bouncing everywhere. 
 

Now you're probably thinking, a ha!  We live in true reality, because our mirrors look pretty and glowy.  Not quite, because ray tracing exists.

You may have heard a fair amount about ray tracing, with game companies, tech writers, and everyone in between tripping over themselves to proclaim a new wave of ~~things for anonymous bloggers to pretend to know a lot about~~ hyperrealism.  

What makes ray tracers so awesome?  We can try comparing these two images:


![CYCLES](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ums1j7jdaf8a1aaqyqzn.png)


 ![EEVEE](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/r1m8f2r22mmogai3unwm.png)
 



The lower one was made using Blender's rasterizer (EEVEE) while the other was made with Cycles, Blender's ray tracer.  As you can tell, ray tracing makes much better reflections and overall realism - the shadows are more defined in the right places with ray tracing, and the reflection is much less warped.


However, ray tracing is not a panacaea - it has its own limitations, which I'll cover later.  

But for now, you can rest assured that ray tracing can provide physically accurate shadows, refractions, and reflections.  Now it's time to take a plunge and figure out how to break ray tracing.

# Part 4: Splish Splash, What a Flash!

Water is the kryptonite of computers.  And no, I'm not just talking about when you accidentally tipped a glass over your keyboard.  

Caustics are what reclusive nerds call indirect lighting, and are responsible for some of the most beautiful things you can witness:


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/xbp4l6ms5qirdvj7mm0z.png)


![Image description](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/fpavr2kvp2ngh83lsglf.png)

(Note the rainbows dispersed by the diamond - I'll cover this in just a sec). 

Because they look so awesome, caustics are also a [huge pain to render accurately](https://www.chaos.com/blog/what-are-caustics-and-how-to-render-them-the-right-way).  Think about it this way - for indirect lighting to be accurate, you need a LOT of photons.  A 1-amp LED projects 6E18 photons every second, while a 1 terabyte hard drive can only hold 1E12 bytes, so to even come close to having caustics not look like this:





You'd need to fill your entire hard drive, and then some.  And even if we give each photon vector only 12 bounces max and assign each bounce, say, 15 operations, a 12 GHz (12E6 operations/second) processor would take a very, very long time to make a pretty diamond picture.  PAIN!  

And if you've taken a physics class recently, you'll remember that when white light is diffracted, it splits into a rainbow, explaining the diamond's fire a few paragraphs up.  But, because physically accurate ray tracers treat light as a vector and not a set of waves, rainbows [don't show up!](https://www.reddit.com/r/blender/comments/rotlkb/caustics_luxcorerender_vs_blender/)

While there's some [level of faking](https://blender.stackexchange.com/questions/40226/how-to-construct-a-diamond-or-other-gemstone-material-in-cycles) you can do to make rainbows inside of diffractive materials, these again aren't physically accurate.  So that's why we need *spectrally accurate* ray tracers.  These treat light as a set of waves, and the math behind them is pretty difficult, but they do exist but aren't real time. 


And rendering water is only half the problem.  If you've ever tried Blender's fluid physics simulations, you need to "bake" (compute) the fluids moving around (I'm not sure if a real time fluid simulator exists).  For a low resolution simulation with one or two vertices in the way, baking takes a few seconds, but the water flow ends up looking weird:

![blender water](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/47qgnyeczodm8p5zrx0o.png)
 

For a more realistic, higher resolution sim, baking can go up to twenty minutes!  When you accidentally shatter a glass of water of the ground, the world doesn't freeze as the direction of the water is computed.  Also, this doesn't just apply to water - fluids, like water and smoke are also a difficult to realistically render in a short amount of itme. 

Hopefully in this article, I've convinced you that the world you live in isn't CGI.  If you just skipped everything I wrote (I don't blame you!) here's a tl;dr: fluids take time to render.  And even if I haven't, you can probably go work for Pixar or explain why old movies look fake.  Thanks for reading, leave a comment if you think I said something wrong, and see you in my next article!