$ show gfxfundamentals/webgl2-fundamentals
This repository is the source code for the webgl2fundamentals.org educational website, a comprehensive, multi-language tutorial series for WebGL2. It is not a standalone application or library, but a static site built from markdown lessons and hundreds of interactive HTML/JavaScript example pages. The code includes reusable utility libraries for matrix math (m4.js, 3d-math.js), WebGL boilerplate (webgl-utils.js), lesson helpers, and a sophisticated interactive WebGL state diagram tool. The build system uses Grunt and custom lesson builders to generate the site. While the core educational content is well-maintained and pedagogically sound, the repository contains some legacy code (tdl library, old jQuery plugins) and many partially translated lessons, indicating ongoing maintenance but with some technical debt.
The LLM identified 3 files worth highlighting for reuse:
A comprehensive 4x4 matrix math library for 3D graphics, providing functions for perspective, orthographic, lookAt, rotation, translation, scaling, inversion, composition, and decomposition. It is self-contained, well-documented, and used across all lesson examples. Demonstrates clean functional API design with support for custom input types (Float32Array, Array, etc.). Easily extractable for any WebGL or 3D project.
A minimal, reusable utility module for common WebGL setup tasks: creating programs from shader sources, compiling shaders, and resizing the canvas to match its display size with HiDPI support. It is dependency-free, follows a simple functional pattern, and is used by nearly every lesson example. Demonstrates the pattern of capturing common boilerplate into a single utility file.
The main entry point for an interactive WebGL state diagram tool that wraps every GL function call to update a live UI showing the current state of textures, buffers, shaders, programs, VAOs, and framebuffers. It includes a stepper for executing code line-by-line, draggable panels, and support for both WebGL1 and WebGL2. Demonstrates advanced GL function wrapping, UI state management, and educational visualization patterns. Could be extracted as a standalone WebGL debugging tool.