如何使用WebGL处理和更新大型数组？

Question

5

我有两个大的Uint8Array。它们的大小分别是：1024和2048

我想在每一帧中更新这些数组。

1024长度的数组可以适合256个vec4 uniforms或16 * 16图像，但我认为这不是正确的方法。

如何从javascript发送大数组到GLSL？

编辑

我的纹理问题在于：要在每一帧中更新图像，我必须将数据复制到ImageData对象中。然后我必须将imageData绘制到画布上。之后，我必须获取画布的dataURL，并更改图像的src属性。

- Iter Ator

分享一下你在 JavaScript 中尝试做哪些修改可能会很有益。这些修改可能可以在像素着色器中完成，从而获得更好的性能（非常非常好！）。 - Paul-Jan

您不需要将数据复制到ImageData中。您可以直接将类型化数组上传到纹理中。 - gman

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Fabian · Accepted Answer

纹理是在WebGL中处理大型数据集的适当方式。您可以将数据存储在1D或2D纹理中，然后在片段着色器中使用它。

您可以直接从类型化数组加载数据到纹理中，无需先创建图像，请参见此答案以获取更多详细信息。

如果uniforms太多，在某些GPU上很容易遇到问题。请参见webglstats.com以获取有关uniforms数量的一些典型限制，特别是MAX_VERTEX_UNIFORM_VECTORS和MAX_FRAGMENT_UNIFORM_VECTORS。