The Developers’ Guide to WebGL 2.0
Let’s make computer graphics on the web! 💻
Do you want to go to mars?
I don’t. It’s a death trap (). But we can enjoy a virtual rendering of it:
This talk will cover a high-level overview of the graphics rendering pipeline, which makes up the rendering above.
Source code will be linked at the document, so there is no need to copy code.
- Dabbling in graphics programming and data visualisation at CSIRO
- Twitter as 🐦 @xavier_ho
- Mastodon as 🐘 firstname.lastname@example.org
- Khronos Melbourne Chapter / Computer Graphics on the Web organiser
- email@example.com — be my pen pal ✒️
In this talk we will …
- Introduce WebGL
- Give an overview of the graphics rendering pipeline
- Apply above knowledge using WebGL 2.0
- Provide useful links at the end of presentation, which will be linked after the talk
- Provide a starting point to many WebGL tutorials out there
This talk will not …
- Answer topical questions like “How do I create a glass shader with specular highlights, refraction and caustics”, or “How do I do networking in a WebVR game?”
- Touch on WebGL frameworks like Three.js, A-Frame, or Whitestorm.js. There are plenty of resources online. I will try to be framework-agnostic in this talk.
Who has used Three.js or A-Frame?
What is WebGL?
What does WebGL offer exclusively that other technology doesn’t?
WebGL sets the foundation for many technologies like , , , and .
WebGL follows the OpenGL ES specification (graphics library for embedded systems, like smartphones) closely, and many concepts will be familiar to those developers.
Who can access WebGL 2.0 today?
Over 3.7 billion people have access to the internet (). Approximately 1.4 billion (38.3%) of them use a browser that supports WebGL 2.0 (, ), with WebGL 1.0 supporting approximately 3.4 billion people (92%) ().
- Side note: this also means that the majority of the population (~51% of the 7.5 billion) does not have access to even basic internet connections. Please design in mind with other humans in need 🙏🏼