It's So Shiny! Building a Pure JavaScript Ray-Tracer

It’s hard to imagine a world without computer generated imagery. Films, television, games, art, advertising… CGI gives artists, designers, and film-makers the tools to bring fantastic fictional worlds to life. And while it wasn’t all that long ago that rendering photorealistic images required a supercomputer, today we can do it right in our browser.

In this session, Dylan Beattie will explain the principles behind ray-tracing, the technique behind most modern computer graphics. - and then, using modern JavaScript APIs like web workers, clamped arrays and ES modules, we’ll create a pure JavaScript ray tracer that runs directly in your browser. We’ll learn how to simulate lighting, shading, reflection, and visual effects to create photo-realistic scenes, we’ll dust off some gnarly mathematics that you probably haven’t seen since high school and find out that it’s actually pretty useful after all, and we’ll create a whole lot of pictures of shiny things.

---

Other talks by Dylan Beattie

Hi there. I'm Dylan.

I do interesting things with computers, code, comedy, music and video, then I travel all over the world and tell people about it. I provide software training and consultancy through my company Ursatile. I'm a keynote speaker, I'm a Microsoft MVP, I created Rockstar, an esoteric programming language that started as a joke and ended up in Classic Rock magazine, and I own the best web address in the history of the internet.

Conferences & Events

Here's where I'm hoping to be over the next few months:

Where I'm Going:

Where I've Been

see all past events

All subject to change, cancellation, virtualisation, postponement, rescheduling and other side-effects of Living In Interesting Times.