如何在WebGL中计算渲染时间？看来我估计错了

Question

我正在运行一个基于交互浏览器的WebGL体呈现。在使用鼠标进行交互时，调用函数drawVolume()。为了测量渲染时间，我在开始和结束时取时间戳。这种差异给了我渲染时间。目前，我正在两台机器上运行: client和Server

以下是意见：

服务器-机器: NVIDIA GeForce GTX970 Render_time大约小于2ms。互动更快。

客户端机器:NVIDIA Quadro K600 Render_time大约为10-11 is。交互显示速度慢，帧更新慢。有时显示驱动程序停止工作，显示也会中断。我需要重启系统。

我不知道，这种方法是否适合计算渲染时间。不知怎么的，我觉得，尽管，代码是被执行的，在硬件层面，渲染的图像还没有显示在浏览器窗口上。如何了解为相应的交互更新的相应框架。如果我得到了这个状态，那么也许我可以正确地计算渲染时间。

drawVolume = function()
{
    start3 = new Date().getTime();  

    gl.clearColor(0.0, 0.0, 0.0, 0.0);
    gl.enable(gl.DEPTH_TEST);
    gl.bindFramebuffer(gl.FRAMEBUFFER, gl.fboBackCoord);
    gl.shaderProgram = gl.shaderProgram_BackCoord;
    gl.useProgram(gl.shaderProgram);
    gl.clearDepth(-50.0);
    gl.depthFunc(gl.GEQUAL);
    drawCube(gl,cube);
    gl.bindFramebuffer(gl.FRAMEBUFFER, null);
    gl.shaderProgram = gl.shaderProgram_RayCast;
    gl.useProgram(gl.shaderProgram);
    gl.clearDepth(50.0);
    gl.depthFunc(gl.LEQUAL);
    gl.activeTexture(gl.TEXTURE0);
    gl.bindTexture(gl.TEXTURE_2D, gl.fboBackCoord.tex);
    gl.activeTexture(gl.TEXTURE1);
    gl.bindTexture(gl.TEXTURE_2D, gl.vol_tex);
    gl.activeTexture(gl.TEXTURE2);
    gl.bindTexture(gl.TEXTURE_2D, gl.tf_tex);
    gl.uniform1i(gl.getUniformLocation(gl.shaderProgram, "uBackCoord"), 0);
    gl.uniform1i(gl.getUniformLocation(gl.shaderProgram, "uVolData"), 1);
    gl.uniform1i(gl.getUniformLocation(gl.shaderProgram, "uTransferFunction"), 2);
    //Set Texture
    drawCube(gl,cube);

    end3 = new Date().getTime();
    render_time=end3-start3;
    console.log(render_time);
}

Answer 1

CPU/GPU交互是异步的，这是使用驱动程序内部命令缓冲区实现的，其中所有发出的命令都是缓冲的，因此不能保证在调用new Date().getTime()时执行命令(使用Date.now()和缓存统一位置会更好)。

在大多数情况下，强制/等待执行给定命令是不可取的，但是可以使用finish(手册页)，它引入同步点并阻止CPU侧执行，直到执行所有命令。但是，正如在gmans的回答中所指出的，这不仅是测量以前发出的命令的执行时间，而且也是延迟管道所需的时间。

理想情况下，您可以使用EXT_disjoint_timer_query扩展来度量给定命令的执行时间，而不会延迟管道，但遗憾的是，到目前为止(2016年10月)，几乎任何浏览器都无法使用/公开该扩展。