Architectural review
The following diagram presents the architecture that has been built throughout the book:
Globals.js
: Defines the global variables gl
(WebGL context), prg
(ESSL program), and the canvas width (c_width
) and height (c_height
).
Utils.js
: Contains auxiliary functions such as getGLContext
which tries to create a WebGL context for a given HTML5 canvas.
WebGLApp.js
: It provides three function hooks, namely: configureGLHook
, loadSceneHook
, and drawSceneHook
that define the life cycle of a WebGL application.
As the previous diagram shows these hooks are mapped to JavaScript functions in our web page:
configure
: Here we create cameras, lights, ...
Get WebGL Beginner's Guide now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.