Summary

In this chapter, we took a closer look at shaders after introducing the concept back in Chapter 3, Introduction to WebGL, when we built a WebGL app. It is helpful to have an understanding of WebGL when you are using OpenGL for WebAssembly because each call to OpenGL from WebAssembly is internally calling the corresponding WebGL functions. We started by rebuilding that WebGL app using a combination of OpenGL ES and SDL in C++ and compiled it to WebAssembly. We then learned how we could use OpenGL and shaders to mix different textures in interesting ways. We used this knowledge to create a pulsing glow around the spaceship's engines. Finally, we discussed 3D lighting and normal maps, and then developed a 2D lighting model and created an app that allows us to light a simple circle with that lighting model. This app demonstrates the possibilities in 2D lighting by allowing us to move our light around a 2D circle with a normal map, which is used to give that 2D surface the appearance of depth.

In the next chapter, we will discuss debugging our WebAssembly application and the tools we can use for performance testing.