The WebGPU Sourcebook: High-Performance Graphics and Machine Learning in the Browser

✍ Scribed by Matthew Scarpino

• Publisher: CRC Press
• Year: 2024
• Tongue: English
• Leaves: 385
• Edition: 1
• Category: Library

✦ Synopsis

The WebGPU Sourcebook: High-Performance Graphics and Machine Learning in the Browser explains how to code web applications that access the client’s graphics processor unit, or GPU. This makes it possible to render graphics in a browser at high speed and perform computationally intensive tasks such as machine learning. By taking advantage of WebGPU, web developers can harness the same performance available to desktop developers.

The first part of the book introduces WebGPU at a high level, without graphics theory or heavy math. The chapters in the second part are focused on graphical rendering and the rest of the book focuses on compute shaders.

This book walks through several examples of WebGPU usage. It also:

• Discusses the classes and functions defined in the WebGPU API and shows how they’re used in practice.

• Explains the theory of graphical rendering and shows how to implement rendering inside a web application.

• Examines the theory of neural networks (machine learning) and shows how to create a web application that trains and executes a neural network.

✦ Table of Contents

Cover
Half Title
Title Page
Copyright Page
Contents
Preface
1. Introduction
The Evolution of WebGPU
Overview of WebGPU Development
Example Code
Summary
2. Fundamental Objects
The Navigator
Promises and GPUAdapters
GPUDevice
GPUCommandEncoder
GPUQueue
Canvas Element
Canvas Context
Example Application—Creating WebGPU Objects
Summary
3. Rendering Graphics
A Gentle Introduction to Graphical Rendering
Render Passes
Example Application—Creating a Blue Canvas
Buffers and Layouts
Summary
4. The WebGPU Shading Language (WGSL)
Fundamentals of WGSL
Vertex Shaders
Fragment Shaders
Shader Modules
Example Application—Drawing an Orange Triangle
Passing Data to the Fragment Shader
Example Application—Drawing a Multi-Colored Triangle
Summary
5. Uniforms and Transformations
Uniform Buffers and Bind Groups
Example Application—Rotating a Square
Storage Buffers
Linear Transformations
Model, View, and Perspective Transformations
Indexed Rendering
Example Application—Drawing Cubes
Summary
6. Lighting, Textures, and Depth
Lighting
Example Application—Drawing a Shiny Sphere
Textures
Example Application—Adding Texture
Depth and Stencil Testing
Summary
7. Advanced Features
Debug Groups
Error Handling
Viewports and Scissor Rectangles
Occlusion Queries
Drawing Text
Example Application—Displaying Text
Animation
Summary
8. Compute Applications
Introducing Compute Applications
Buffer Operations
Workgroups and Invocations
Compute Shaders
Example Application—Simple Computation
Time Stamps
Atomic Variables and Functions
Example Application—Dot Product
Summary
9. Machine Learning with Neural Networks
Iris Classification
Neurons and Perceptrons
Improving the Model
Activation Functions
Layers and Deep Learning
Training
Example Application—Classifying Irises
Summary
10. Image and Video Processing
Storage Textures
Image Filtering
Example Application—Image Sharpening
Video Processing
Example Application—Video Conversion
Summary
11. Matrix Operations
Matrix Transposition
Matrix Multiplication
The Householder Transformation
QR Decomposition
Example Application—Matrix Factorization
Summary
12. Filtering Audio with the Fast Fourier Transform (FFT)
The Web Audio API
Overview of Audio Processing
The Discrete Fourier Transform (DFT)
Example Application—Filtering Audio with the DFT
The Fast Fourier Transform (FFT)
Example Application—Filtering Audio with the FFT
Summary
Appendix A: Node and TypeScript
Appendix B: WebAssembly, Emscripten, and Google Dawn
Index

✦ Subjects

Web Programming; Machine Learning; GPU Programming; Shaders; WebGPU; Graphic Rendering; Neural Networks; Web Applications; Computer Graphics