为什么 WebGL 片段着色器在移动设备上会随着时间的推移而变慢？
Why do WebGL fragment shaders slow down over time on mobile?
我找不到任何可以在移动浏览器中保持 60fps 的 WebGL 片段着色器。他们一开始会 运行 流畅，但在几分钟后会无情地变慢和卡顿。
这里有一个简单的例子来说明这个问题。 http://glslsandbox.com/e#74134.2
这里 运行在 iPadOS 上待了几分钟。 https://youtu.be/oVPVER9RCP0
像这样的着色器在移动设备上根本不是一个选项吗？
更新： 这显然只适用于 WebGL1 上下文。在使用 WebGL2 的网站上，例如 ShaderToy，着色器 运行 流畅。
我已经弄明白了。正如 pleup 推测的那样，这是一个精度问题。
在我测试的每个着色器上，运动在某种程度上依赖于需要精确的十进制值时间输入的函数。随着任何浮点值的增加，它在此范围内的精度会降低。所以当时间统一发生这种情况时，它会给出外观性能不佳。
那么为什么这只发生在移动设备上？
这是因为桌面设备有时会忽略全局精度设置并使用 highp。 mediump 对于分钟长的时间值不够精确，但是您无法在不使用 mediump 的机器上分辨出来。
所以最后，修复方法是通过将时间值声明为 uniform highp float time.
来强制其精度
我找不到任何可以在移动浏览器中保持 60fps 的 WebGL 片段着色器。他们一开始会 运行 流畅，但在几分钟后会无情地变慢和卡顿。
这里有一个简单的例子来说明这个问题。 http://glslsandbox.com/e#74134.2
这里 运行在 iPadOS 上待了几分钟。 https://youtu.be/oVPVER9RCP0
像这样的着色器在移动设备上根本不是一个选项吗？
更新： 这显然只适用于 WebGL1 上下文。在使用 WebGL2 的网站上，例如 ShaderToy，着色器 运行 流畅。
我已经弄明白了。正如 pleup 推测的那样，这是一个精度问题。
在我测试的每个着色器上，运动在某种程度上依赖于需要精确的十进制值时间输入的函数。随着任何浮点值的增加，它在此范围内的精度会降低。所以当时间统一发生这种情况时，它会给出外观性能不佳。
那么为什么这只发生在移动设备上？
这是因为桌面设备有时会忽略全局精度设置并使用 highp。 mediump 对于分钟长的时间值不够精确，但是您无法在不使用 mediump 的机器上分辨出来。
所以最后，修复方法是通过将时间值声明为 uniform highp float time.