更多精彩内容尽在 dt.sim3d.cn ，关注公众号【sky的数孪技术】
WebGL的第一个版本1.0于2011年被正式推荐。随后，在 2016 年举办的 SIGGRAPH 上，宣布 NVIDIA 的驱动程序已全部通过 WebGL 2.0 一致性测试。在这篇文章中，我们来介绍一下WebGL 2.0的典型特征。
与 OpenGL ES 的关系
WebGL 通常被描述为“OpenGL ES 的绑定”。换句话说就是 WebGL 允许我们将相当于 OpenGL ES 的图形 API 作为 JavaScript API 执行。
OpenGL ES 是适用于移动设备的轻量级 OpenGL 实现，而 WebGL 是该功能的一个版本，可以直接在浏览器上执行。WebGL 1.0是基于OpenGL ES 2.0的，对于 WebGL 2.0，则是基于 OpenGL ES 3.0。换句话说，WebGL 从 1.0 升级到 2.0 会带来 OpenGL ES 从 2.0 到 3.0 几乎相同的变化。
此外，通过此版本更新，将对 OpenGL 的着色器描述语言 GLSL 进行更改。
OpenGL ES的三个版本中，3.0、3.1和3.2的功能有很大不同。不幸的是，3.0 系列不支持几何着色器和计算着色器等新着色器。换句话说，WebGL 2.0仍然只支持两种类型的着色器：顶点着色器和片段着色器。
MRT（多渲染目标）
MRT 在 WebGL 1.0 中被视为扩展，现已标准化。这允许默认情况下使用更高级别的着色技术，例如延迟渲染。
顾名思义，MRT 是一种允许同时输出到多个渲染目标的技术。例如，当将法线和深度信息写入帧缓冲区时，gl_FragColor每次都需要发出单独的绘图命令并输出法线和深度。但是，使用 MRT 时，gl.drawArrays只需一次绘制调用（或其他绘图命令）即可同时输出到多个缓冲区。
VAO（顶点数组对象）
这也是扩展功能的升级。虽然名字和VBO（Vertex Buffer Object）类似，但是却完全不同。
以前，存储与顶点相关的数据（例如 VBO 和 IBO）的缓冲区必须一一单独绑定。因此，例如我们想绘制多个形状，则每次更改模型数据时都必须执行大量的绑定处理。
VAO 是一个允许将这些与顶点相关的缓冲区视为单个对象的概念。 VAO可以让复杂、冗余的绑定处理得到简洁的描述。
实例化数组
这也是从高级功能升级为基础功能的功能之一。
实例绘制允许在应用多个不同状态的同时绘制大量对象，这将帮助我们构建比以往更丰富的场景。
Transform feedback
这是 WebGL 1.0 以前不提供的功能。
Transform feedback是一种允许从 GPU 直接输出到缓冲区而不经过 CPU 的功能。虽然很多人听了可能不太理解，但是这是一个非常强大的功能。
例如我们想重用 GPU 处理的值，我们只能将它们输出到颜色缓冲区并将它们以纹理的方式使用。但是通过 Transform feedback，我们可以直接从着色器写入缓冲区（例如 VBO）。换句话说，我们可以仅使用着色器快速重写缓冲区的内容，而不是在CPU端（JavaScript）更新VBO的内容。
虽然计算着色器无法在 WebGL 2.0 中使用，但现在可以使用着色器直接重写缓冲区的内容，从而比以前更容易执行类似 GPGPU 的处理。
UBO（uniform缓冲对象）
UBO 是一个允许将uniform变量作为单个单元（如结构体）进行处理的函数。
在之前的WebGL 1.0系列中，即使uniform变量具有相同的结构，它们也不能被不同的着色器共享。通过使用 UBO，可以将完全相同的值作为统一变量发送到多个着色器。
不过，从名字上你大概也能猜到，它的行为就像VBO一样，是一个缓冲对象，所以需要进行绑定等处理，所以不一定能简化编写。使用前有必要正确了解其性质。
采样器对象
如果你使用过 WebGL 或 OpenGL，你可能见过用 GLSL 编写的“采样器”。
在非常粗略的层面上，有些人可能会理解采样器是纹理，但这里的采样器对象并不是指纹理本身。
简单来说，采样器就是如何对纹理进行采样。 Sampler 对象使采样规则独立为单个对象，从而在引用纹理时更容易处理采样方法。
纹理相关的变化
WebGL 2.0 最显着的变化与纹理有关。
例如，默认支持浮点纹理。此外，纹理大小不再限于 2 的幂。
总体而言，支持的纹理格式的数量将大幅增加。 WebGL 1.0 中甚至不存在的许多纹理格式现在默认可用，包括 3D 纹理、2D 纹理数组。
这个领域涉及编写 GLSL 的内容很多，所以一下子理解所有内容会很困难。然而，毫无疑问，我们将能够比以往更灵活地使用各种纹理的技术，因此需要根据目的使用每种技术。
缓冲区之间的交互
WebGL 2.0 还添加了一些功能，例如在缓冲区之间复制值。
添加在缓冲区级别与数据交互的方法，例如传输帧缓冲区的内容和复制 VBO 的内容。
查询对象
WebGL 2.0 引入了一个新概念：查询。
这一开始可能很难想象，但它可以允许我们发出某种查询并执行处理，同时动态获取结果。例如它是实现遮挡剔除等技术的基本概念。