WebGL能够使用GPU的全部功能吗？

Question

我尝试运行GPU密集型WebGL着色器，即使在复杂环境中访问基准测试诸如this one which renders 30,000 fish之类的野生WebGL模拟的页面时，也无法使我的GPU在任务管理器中的使用率达到超过30％的峰值。也许这是WebGL安全功能？即使涉及禁用浏览器（任何浏览器）中的安全设置，也可以通过编程方式强制WebGL使用100％的GPU？

Answer 1

您尝试了什么？消耗100％的GPU功率很简单。只需画一些需要很长时间的东西即可。您链接到的水族馆并非旨在做到这一点。

这是一个普通的人

const gl = document.createElement('canvas').getContext('webgl');
gl.canvas.width = 2048;
gl.canvas.height = 2048;
const vs = `
attribute vec4 position;
void main() {
  gl_Position = position;
}
`;
const fs = `
precision mediump float;
void main() {
  gl_FragColor = vec4(1);
}
`;
const quad =  [
  -1, -1,
   1, -1,
  -1,  1,
  -1,  1,
   1, -1,
   1,  1,
];
const maxQuads = 50000;
const quads = [];
for (let i = 0; i < maxQuads; ++i) {
  quads.push(...quad);
}

const programInfo = twgl.createProgramInfo(gl, [vs, fs]);
const bufferInfo = twgl.createBufferInfoFromArrays(gl, {
  position: {
    data: quads,
    numComponents: 2,
  },
});

let count = 10;
function render() {
  gl.viewport(0, 0, gl.canvas.width, gl.canvas.height);
  gl.useProgram(programInfo.program);
  twgl.setBuffersAndAttributes(gl, programInfo, bufferInfo);
  gl.drawArrays(gl.TRIANGLES, 0, 6 * count);
  
  requestAnimationFrame(render);
}
requestAnimationFrame(render);

document.querySelector('input').addEventListener('input', (e) =>  {
  count = Math.min(parseInt(e.target.value), maxQuads);
});

<script src="https://twgljs.org/dist/4.x/twgl.min.js"></script>
<p>increase number to increase GPU usage. Large numbers will get the browser or OS to reset the GPU.</p>
<input type="number" value="10">

对我来说，值为30会使GPU饱和，并使一切变慢（操作系统也需要GPU，但我们对此很费力）

在30时，每个绘制调用都绘制2048x2048x30像素。每个抽奖电话为1.258亿像素。