如何确定活动WebGL上下文的数量？
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何确定活动WebGL上下文的数量？相关的知识，希望对你有一定的参考价值。
浏览器对活动WebGL上下文的数量施加了限制。超过限制和browser will start to dump older contexts。我的理解是每个域都有限制，总的上限也有限制。
两个问题：
- 是否有办法确定您离极限有多近，即有多少个活动WebGL上下文以及有多少个可用的WebGL上下文？
- 我在这里和那里发现了一些零碎的信息，但无法准确确定每个浏览器的限制（每个域和最大）。 Chrome，Firefox，Safari，Edge和IE 11的限制是什么？
答案
没有可靠的方法来知道浏览器支持多少个上下文，即使您确实知道它明天可能会更改，也可能会根据运行浏览器的计算机的各种条件或浏览器自身的启发式而改变，例如vram低，它允许较少的上下文。或者，如果最新的上下文使用过多的资源，则它会尝试通过丢失其他上下文来释放空间。
我个人的经验法则是浏览器至少支持8种上下文。这就是我建立自己的网站所要假设的。
您可能会理解为什么会有限制。 WebGL应用程序占用大量资源。也许不是全部，但特别是游戏可以轻松地使用vram的演出，并且不像常规ram那样轻易地对vram进行虚拟化，特别是因为要以某种方式在浏览器中显示结果，所有结果都必须使其相同处理。因此，由于它们很可能没有被虚拟化，并且由于它们可以使用太多资源，因此浏览器需要限制一次可以创建多少资源，以便为用户访问的最新页面释放资源。
[有很多技术人员可以使用单个上下文在整个网页上显示很多东西，这些东西在您链接到的问答中都涉及或引用。
您可以这样数：
const canvases = [];
let done;
function createCanvas()
const canvas = document.createElement('canvas');
canvas.addEventListener('webglcontextlost', () =>
done = true;
console.log('num contexts:', canvases.length - 1);
);
const gl = canvas.getContext('webgl');
canvases.push(canvas);
const wait = ms => new Promise(resolve => setTimeout(resolve, ms));
async function main()
while (!done)
createCanvas();
await wait();
main();以上是关于如何确定活动WebGL上下文的数量？的主要内容，如果未能解决你的问题，请参考以下文章
如何在网页中同时传播数百个带有动画和交互式 webgl 上下文的小画布？
如何在 WebGL 的 texImage2D 中裁剪 HTMLVideoElement？