webgl2 中栅栏同步的正确用法是什么? [英] What is a proper usage of fence synchronization in webgl2?

问题描述

在 webgl2 (gl.fenceSync) 中寻找适当使用围栏的一些模式/代码示例/最佳实践 - 如果它不会阻塞 JS 线程，则最好.

Looking for some patterns/code examples/best practices of appropriate usage of fences in webgl2 (gl.fenceSync) - best if it would be non blocking of JS thread.

    var fence = gl.fenceSync(gl.SYNC_GPU_COMMANDS_COMPLETE, 0);

    setTimeout(() => {
      gl.clientWaitSync(fence, gl.SYNC_FLUSH_COMMANDS_BIT, 1000000);
      gl.getBufferSubData(gl.TRANSFORM_FEEDBACK_BUFFER, 0, dataOut);
    }, 0);

推荐答案

老实说，我只是猜测，我实际上不确定 WebGL2 中的同步有多大用处，但我认为您不想阻止那么模式会是这样的

I'm just guessing to be honest, I'm not actually sure how useful syncs are in WebGL2 but I'd think you don't want to block then the pattern would be like this

function main() {
  const gl = document.createElement('canvas').getContext('webgl2');
  if (!gl) {
    return alert('need webgl2');
  }
  
  callbackOnSync(gl, () => {
    console.log("done");
  });
  
  function callbackOnSync(gl, callback) {
    const sync = gl.fenceSync(gl.SYNC_GPU_COMMANDS_COMPLETE, 0);
    gl.flush();  // make sure the sync command is read

    setTimeout(checkSync);  

    function checkSync() {
      const timeout = 0;   // 0 = just check the status
      const bitflags = 0;
      const status = gl.clientWaitSync(sync, bitflags, timeout);
      switch (status) {
        case gl.TIMEOUT_EXPIRED:
          // it's not done, check again next time
          return setTimeout(checkSync);
        case gl.WAIT_FAILED:
          throw new Error('should never get here');
        default:
          // it's done!
          gl.deleteSync(sync);

          callback();
      }
    }
  }
}

main();

这篇关于webgl2 中栅栏同步的正确用法是什么?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！