我们是否需要使用<canvas>实现双缓冲？

const canvas = document.getElementById('canvas');
const ctx = canvas.getContext('2d');
const bufferCanvas = document.createElement('canvas');
const bufferCtx = bufferCanvas.getContext('2d');

// 设置画布大小
canvas.width = bufferCanvas.width = 800;
canvas.height = bufferCanvas.height = 600;

// 绘制图形
function draw() {
  // 清除画布
  bufferCtx.clearRect(0, 0, bufferCanvas.width, bufferCanvas.height);

  // 在缓冲画布上绘制图形
  bufferCtx.fillStyle = 'red';
  bufferCtx.fillRect(10, 10, 50, 50);

  // 将缓冲画布的内容复制到前台画布上
  ctx.drawImage(bufferCanvas, 0, 0);

  // 请求下一帧动画
  requestAnimationFrame(draw);
}

// 开始绘制动画
draw();