WebGL如何用于通用计算（GPGPU）？

Question

我听说你可以通过生成纹理和使用RGB值（或类似的东西来运行计算）来使用WebGL进行通用计算（GPGPU）。这怎么可能，有人可以提供一个简单的代码示例吗？

具体来说，我知道您可以使用图像并将它们映射到具有纹理的曲面，但我不知道如何在WebGL着色器中创建RGB值的任意纹理。此外，一旦您生成了纹理，您将以何种方式使用RGB值来实际进行计算？最后，一旦执行了计算，如何将结果传递回JavaScript，以便以有意义的方式使用它们？

谢谢。

Answer 1

WebGL（OpenGL）允许您创建着色器程序，允许您在GPU上运行自己的应用程序代码。通常，这用于计算要显示的位置和颜色。为此，您可以提供GPU数据，并使用提供给GPU的数据运行自己的代码。可以想象，传递任意数据并运行任意指令的能力=一般计算的可能性（在限制范围内）。

您也不必直接渲染到屏幕（后台缓冲区），而是渲染到您选择的纹理。但其中一个限制（基本规范）是您只能为每个像素输出4 * 8位RGBA值。你如何计算这个32位RGBA以及你如何解释它完全取决于你。

作为一个例子，也许您想要运行许多sqrt计算。首先，您使用每个＆＃34;像素＆＃34;创建一个纹理。纹理是你的初始值（浮动打包到RGBA）;然后在GPU上，指示它对每个像素进行sqrt计算并输出结果;结果是垃圾作为屏幕颜色，但如果你编写一个将RGBA转换回浮动的解包函数，那么你就拥有了基于GPU的sqrt计算器！

此外，纹理只不过是以特定格式打包的值数组。以canvas.getContext("2d").getImageData(0,0,10,10)为例。 WebGL中的等价物是gl.readPixels()。

然而，我没有可运行的例子，WebGL api非常冗长，需要花费大量的时间来完成简单的操作。