js中播放gif卡顿

function playGifSmoothly(gifElement) {
  let frames = [];
  let currentFrame = 0;
  let isPlaying = true;

  // 假设我们已经有了 GIF 的所有帧数据
  // 这里只是示例，实际应用中需要从 GIF 文件中提取帧数据
  for (let i = 0; i < gifElement.frames.length; i++) {
    frames.push(gifElement.frames[i]);
  }

  function renderFrame() {
    if (isPlaying) {
      gifElement.src = frames[currentFrame];
      currentFrame = (currentFrame + 1) % frames.length;
      requestAnimationFrame(renderFrame);
    }
  }

  renderFrame();

  // 提供开始和停止播放的方法
  return {
    start: () => { isPlaying = true; renderFrame(); },
    stop: () => { isPlaying = false; }
  };
}

// 使用示例
const myGif = document.getElementById('my-gif');
const gifPlayer = playGifSmoothly(myGif);

// 开始播放
gifPlayer.start();

// 停止播放
// gifPlayer.stop();