Webgl呈现时间限制- Internet Explorer 11

Question

我有一个问题，有时( 50到100) Internet explorer会抛出此警告，这将导致webgl呈现失败并引发：

WEBGL11257:在GPU上渲染WebGL内容花费的时间太长了。暂时切换到软件渲染。

我使用Three.js，当发生这种情况时，我的Webgl呈现器上下文将停止工作，因为它假定它使用的是GPU。然后，它将抛出x个特定于WebGL的函数的错误。

通过在注册表编辑器：https://support.microsoft.com/en-us/help/3099259/update-to-add-a-setting-to-disable-500-msec-time-limit-for-webgl-frame-in-internet-explorer-11中执行以下更改，可以在我的计算机上通过超过时间限制(默认为500 my )来修复此问题。

当然，这不是一个可持续的解决方案，因为运行IE11或Edge的客户端不应该这样做。我想知道是否有人偶然发现了这个问题，客户端是否有什么可做的？

Answer 1

解决方案是停止渲染任何花费太长时间的渲染。在大多数WebGL实现中，对draw函数的每个调用都是定时的。如果花费太长时间，浏览器将失去webgl上下文。

通常花费时间太长的事情的例子。

• 画太多的大三角形/点 你可以画数十万，甚至数百万的三角形，如果它们一般是小的，但是，画非常大的三角形，覆盖整个屏幕，事情会变得太慢。
• 用复杂的片段着色器绘制大量像素 片段着色器运行的每一个像素，他们也呈现。一个1920x1080屏幕有超过200万像素，所以一个运行200万次的慢速片段着色器可能会变得太慢。
• 使用随机纹理读取。 GPU被优化为以一种简单的方式读取纹理。它有点假设，如果你在一个纹理中读取一个纹理，你就会读取附近的其他纹理，并缓存附近的纹理。如果你以半随机的顺序读取纹理，你就会击败缓存，而且速度会很慢。

解决办法

• 如果你需要画很多大的东西，把你的抽奖电话分开。 假设在一次调用中绘制100万个三角形太慢了。在10次抽签调用中尝试绘制100 k
• 优化片段着色器
• 前后对不透明物体进行排序和绘制。 这是因为GPU可以对每个像素进行深度测试，如果测试失败，则该像素的片段着色器不会运行。

但是，最终如果您的抽签调用之一占用500 is (每秒1/2)，而您无法优化，那么您的页面可能真的会让用户感到沮丧。您可以在几个帧上绘制较小的部分，以保持您的帧速率高，这样UX就能保持响应。

另一件可以触发同样错误的事情是一个着色器，它需要很长时间才能编译。着色器编译后可能运行得足够快，但是编译着色器本身的复杂性，特别是在DirectX上，最终可能需要超过500‘s，浏览器将失去WebGL上下文。例如，这个非常糟糕的着色器在我的iPhone上为我运行，但是在iPhone上编译时间太长，浏览器就失去了WebGL上下文。

Answer 2

如果要切换画布元素上的可见性，则会触发此错误。