高效渲染精灵

Question

为了天真地渲染精灵，您可以发送带有位置、旋转、大小和纹理的单个矩形。这很容易，但是考虑到减少状态更改、绘制调用和数据上传是提高渲染性能的好方法，这显然不是一个有效的解决方案。有些技术，如将每个sprite作为一个单一的原语传递，以及在几何图形着色器中组装一个矩形，是非常吸引人的，但如果目标是WebGL这样的平台，甚至是更旧的硬件，这些技术是不可用的。

除了批处理和纹理别名等问题之外，如何有效地提交几何图形来渲染精灵呢？

我对呈现API不可知论的答案感兴趣，但是使用OpenGL或Direct这样的特定API可以进行说明。

Answer 1

提高精灵渲染效率的一个很好的方法是几何实例。这允许您使用一个顶点/索引缓冲区对定义一个网格，然后使用元素定义实例的第二个顶点缓冲区在单个绘图调用中呈现该网格的多个实例。这是比几何着色器更广泛的支持；特别是，在WebGL中通过夹角_特例_阵列扩展支持它。

要将其应用于精灵，一个顶点缓冲区可以定义精灵的形状(即由两个三角形组成的四角体)，然后另一个顶点缓冲区可以包含每个精灵的信息，如位置、旋转、大小等。

如果每个精灵和N个精灵有4个顶点，则顶点着色器将被称为4N次，每个精灵中的每个顶点各一次。您可以使用顶点着色器将来自两个缓冲区的信息放在一起，将每个顶点适当地转换为sprite的属性。这允许GPU为saves生成所有顶点，并保存从CPU上传的数据。

巧合的是，我最近发表了一个小型OpenGL实例演示。

使用这种方法确实需要所有的精灵都以相同的状态绘制，即相同的着色器、纹理、混合模式等等。如果某些精灵需要不同的状态，那么每个状态组合都需要单独的一批实例。