Real-Time 3D Graphics with WebGL 2 - Second Edition

Architecture Updates

Let's cover some useful functions that we can refactor for use in later chapters:

1. Open common/js/utils.js in your editor to see the following changes.
2. We have added two additional methods, autoResizeCanvas and getShader, to utils.js that look very similar to the code we implemented earlier in this chapter:

'use strict';// A set of utility functions for /common operations across our // applicationconst utils = {  // Find and return a DOM element given an ID  getCanvas(id) {    // ...  },  // Given a canvas element, return the WebGL2 context  getGLContext(canvas) {    // ...  },  // Given a canvas element, expand it to the size of the window  // and ensure that it automatically resizes as the window changes  autoResizeCanvas(canvas) ...