flâneur — a map of the web's best reading

City In A Bottle – A 256 Byte Raycasting System | Killed By A Pixel

frankforce.com · 2,889 words · saved by 1 readers

Hello size coding fans. Today, I have something amazing to share: A tiny raycasting engine and city generator that fits in a standalone 256 byte html file. In this post I will share all the secrets about how this magical program works. Here’s my tweet that contains the code and a video of the output… You may have already seen this post on my twitter timeline. After I originally released it about 2 years ago it ended up being one of my most popular tweets ever. Thank you for supporting this strange obsession of mine. Keep reading and I will try my best to explain how and why it works the way it does… This amazing program uses many different concepts in a very small space, understanding it is kind of like solving a puzzle. There are several main pieces including the html code, frame update loop, rendering system, raycasting engine, and the city itself. Here is a demo of the code running live in your browser… You might think that it would require some advanced math to unravel this mystery

City In A Bottle &#8211; A 256 Byte Raycasting System &#8211; Killed By A Pixel Skip to content www.FrankForce.com Making Code Happen Killed By A Pixel City In A Bottle &#8211; A 256 Byte Raycasting System Hello size coding fans. Today, I have something amazing to share: A tiny raycasting engine and city generator that fits in a standalone 256 byte html file. In this post I will share all the secrets about how this magical program works. Here&#8217;s my tweet that contains the code and a video of the output… A City in a Bottle 🌆 <canvas style=width:99% id=c onclick=setInterval('for(c.width=w=

Explore this link on the map →

saved by

related reading