Может ли WebGL использовать всю мощь графического процессора? - PullRequest
0 голосов
/ 06 апреля 2019

Я попытался запустить шейдер WebGL с интенсивным использованием графических процессоров и не смог заставить свой графический процессор работать с пиковой нагрузкой более чем на ~ 30% в диспетчере задач, даже при посещении страниц, на которых тестируются дикие симуляции WebGL, такие как , на которых отображается 30 000 рыб всложная среда.Возможно, это функция безопасности WebGL?Есть ли способ программно, даже если он включает в себя отключение настроек безопасности в браузере (любом браузере), заставить WebGL использовать 100% графического процессора?

1 Ответ

2 голосов
/ 07 апреля 2019

Что вы пробовали? Это просто использование 100% мощности вашего графического процессора. Просто дайте ему что-то нарисовать, что занимает много времени. Аквариум, с которым вы связаны, не предназначен для этого.

Вот тривиальный

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 насыщало графический процессор, а также замедляло все (ОС тоже нуждается в графическом процессоре, но мы загружаем его)

В 30 каждый вызов отрисовки рисует 2048x2048x30 пикселей. Это 125,8 миллиона пикселей на вызов.

enter image description here

...