用于渲染视频的 2d 上下文与 WebGL

我目前正在使用CanvasRenderingContext2D.drawImage()将来自 RTC 媒体流的视频绘制到画布上。不幸的是，这会占用大量的 CPU 资源。

使用以下方法执行此操作会性能更高吗WebGLRenderingContext？ （硬件加速？）如果是，具体如何处理这个问题，最好不创建中间视频元素？

更新 ：

Source: https://github.com/mdn/dom-examples/blob/e9ee0e48efb6158878dbfe70878d3663f52ab6f7/webgl-examples/tutorial/sample8/webgl-demo.js#L374 https://github.com/mdn/dom-examples/blob/e9ee0e48efb6158878dbfe70878d3663f52ab6f7/webgl-examples/tutorial/sample8/webgl-demo.js#L374

function updateTexture(gl, texture, video) {
  const level = 0;
  const internalFormat = gl.RGBA;
  const srcFormat = gl.RGBA;
  const srcType = gl.UNSIGNED_BYTE;
  gl.bindTexture(gl.TEXTURE_2D, texture);
  gl.texImage2D(
    gl.TEXTURE_2D,
    level,
    internalFormat,
    srcFormat,
    srcType,
    video
  );
}