GPU 并行思维、WebGPU 渲染与计算管线、GPGPU 粒子与性能优化。
同一张 Mandelbrot 分形，左边用 JavaScript 逐像素计算，右边用片元着色器让每个像素各自成为一个线程。
从“有没有 GPU”到屏幕上出现三角形的完整路径：adapter、device、管线、命令编码与提交。
用顶点缓冲、索引缓冲和 uniform 缓冲喂数据给 WGSL，并通过绑定组把资源接到着色器上。
第一个 WebGPU 计算着色器：存储缓冲进出、工作组与调度、把结果读回 CPU，并与 JS 循环对比。
十几万个粒子完全在 GPU 上模拟：计算 pass 原地更新存储缓冲，渲染 pass 直接从同一缓冲读取并实例化绘制。
用两个存储缓冲轮流读写（乒乓）运行康威生命游戏，二维工作组每个线程负责一个细胞，再用实例化按年龄上色绘制。
没有计算着色器时，把数据存进浮点纹理、用片元着色器做计算、在两张纹理间乒乓，就能在 WebGL2 上跑一个水波模拟。
同一画面三种画法：N 个独立网格、一个 InstancedMesh、一个合并几何体，对比绘制调用数和 CPU 开销。
用 TSL 在 JavaScript 里搭建着色器节点图：同一个材质在 WebGPU 上编译成 WGSL，在 WebGL 2 后备上编译成 GLSL，再加一个计算节点驱动粒子。
用 WebGPU 计算着色器做模糊、边缘检测和调色：工作组先把图块连同边框载入共享内存，同步后再从共享内存滤波。
每个旋钮对应一种瓶颈：重绘层数、片元运算量、纹理带宽、分辨率和顶点数，用定时器查询读出真实的 GPU 时间。