一、基础概念的理解
- adapter：描述GPU的物理属性，例如其名称、扩展和设备限制，可以用其拿到
device。 - device：访问 WebGPU API 核心的方式，通过其API能对GPU进行操作。
- queue：允许将工作异步提交到GPU。
- canvas context：最终图形输出的地方 `
// adapter
let adapter: GPUAdapter = null;
adapter = await entry.requestAdapter();
//device
let device: GPUDevice = null;
device = await adapter.requestDevice();
//queue
let queue: GPUQueue = null;
queue = device.queue;
// context
const context: GPUCanvasContext = canvas.getContext('webgpu')
`
二、初始化资源
- Vertex & Index Buffers：顶点数据缓冲区 and 索引数据缓存区，记录对应的数据信息。
- Shader： GPU流水线上一些可高度编程的阶段，由着色器编译出来的最终代码是会在 GPU 上运行的。 有一些特定类型的着色器，如 顶点着色器，片元着色器等。
- Shader modules：是纯文本 WGSL 文件，在执行给定管线时在 GPU 上执行。
- 顶点着色器：几何阶段的数据，对每一个顶点调用顶点着色器，计算顶点的颜色和进行坐标变换。
- 片元着色器： 根据插值结果，纹理采样、计算光照结果（对每一个像素进行光照结果的计算，这样的计算的结果比放在三角形变换里更正确、柔和）等。
- Graphics Pipeline：描述了要输入到基于光栅的图形管道执行中的所有数据。
着色器的执行需要管道，管道的执行需要着色器模块
【发现WebGPU Sharding Language需要Rust、TypeScript、Metal的学习，所以也得去学习一下】
