js requestanimationframe

// 使用 requestAnimationFrame 的示例代码

// 定义一个变量来跟踪动画帧的请求 ID
let requestId;

// 定义一个函数来执行动画逻辑
function animate() {
  // 在这里可以添加绘制或更新 DOM 的代码
  console.log('动画帧');

  // 请求下一帧动画
  requestId = requestAnimationFrame(animate);
}

// 开始动画
requestId = requestAnimationFrame(animate);

// 如果需要停止动画，可以调用 cancelAnimationFrame 并传入 requestId
// cancelAnimationFrame(requestId);

解释说明：

• requestAnimationFrame 是一个浏览器 API，用于在下一次重绘之前调度一个函数调用。它通常用于创建平滑的动画。
• animate 函数会在每一帧中被调用，并且可以在其中执行绘制或更新操作。
• requestId 用于存储 requestAnimationFrame 返回的 ID，以便稍后可以通过 cancelAnimationFrame 来停止动画。
• 通过递归调用 requestAnimationFrame(animate)，我们可以持续地在每一帧中执行动画逻辑，直到显式停止。