Most examples used in this video series are based on my recently published book "Practical WebGPU Graphics"

WebGPU is the next-generation graphics API and future web standard for graphics and compute, aiming to provide modern 3D graphics and computation capabilities with the GPU acceleration. This book provides all the tools you need to help you create advanced 3D graphics and GPU computing on the web with this new WebGPU API. It provides about 60 ready-to-run sample programs that allow you to explore WebGPU graphics techniques.


Live Demos for WebGPU Step-By-Step Video Series:

  1. Set up Development Environment
  2. Create First Triangle
  3. Create Triangle with Different Vertex Colors
  4. Create a Triangle with GLSL Shaders
  5. Create Point and Line Primitives
  6. Create Triangle Primitives
  7. Create a Colorful Square with GPU Buffer
  8. Create a Colorful Square with a Single GPU Buffer
  9. Create a Colorful Square with an Index GPU Buffer
  10. Create a 3D Cube with Distinct Face Colors
  11. 3D Cube Animation and Camamera Control
  12. 3D Cube with Distinct Vertex Colors
  13. Create a 3D Sphere Wireframe
  14. Create a 3D Cylinder Wireframe
  15. Create a 3D Cone Wireframe
  16. Create a 3D Torus Wireframe
  17. Implement Light Model: No demo for this video.
  18. Create a 3D Cube with Lighting Effect
  19. Create a 3D Sphere with Lighting Effect
  20. Create a 3D Cylinder with Lighting Effect
  21. Create a 3D Cone with Lighting Effect
  22. Create a 3D Torus with Lighting Effect
  23. Implement Colormap Model: No demo for this video.
  24. Implement 3D Simple Surfaces: No demo for this video.
  25. Create a 3D Sinc Surface
  26. Create a 3D Peaks Surface
  27. Implement 3D Parametric Surfaces: No demo for this video.
  28. Create a 3D Klein Bottle
  29. Create a 3D Wellenkugel Surface
  30. Create a 3D Seashell Surface
  31. Create a 3D Sievert-Enneper Surface
  32. Create a 3D Breather Surface
  33. Texture Mapping: No demo for this video.
  34. Create a 3D Textured Cube
  35. Create a 3D Textured Sphere
  36. Create a 3D Textured Cylinder
  37. Create a 3D Textured Sinc Surface
  38. Create a 3D Textured Peaks Surface
  39. Create a 3D Textured Klein Bottle
  40. Create a 3D Textured Wellenkugel Surface
  41. Create Multiple Texture Mapping
  42. 3D Surface Charts: No demo for this video.
  43. Create a 3D Sinc Surface Chart
  44. Create a 3D Peaks Surface Chart
  45. Create a 3D Sphere Surface Chart
  46. Create a 3D Torus Surface Chart
  47. Create a 3D Klein Bottle Surface Chart
  48. Create a 3D Wellenkugel Surface Chart
  49. Create Tow Cubes in a Single Scene
  50. Create Multiple Cubes in a Single Scene
  51. Create Multiple Objects in a Single Scene
  52. Create Multiple Objects using Different Pipelines
  53. Create 3D Surface Charts using multiple pipelines: No demo for this video.
  54. Create Sinc Surface Chart using Multiple Pipelines
  55. Create Peaks Surface Chart using Multiple Pipelines
  56. Anti-Aliasing: MSAA
  57. Domain Coloring for Complex Functions