17、requestAnimationFrame 和requestIdleCallback 的执行时机

浏览器执行情况：

宏任务 --> 微任务 --> requestAnimationFrame --> 渲染 --> requestIdleCallback --> 下一个宏任务 --> .....

requestAnimationFrame：在下一次浏览器重绘之前一定会执行，常用于动画处理

const divEle = document.getElementById('xxx')

let x = 0
const moveAnimation = () => {
  if(x > 20) return 

  divEle.style.marginLeft = `${x}px`;

  window.requestAnimationFrame(moveAnimation)

  x++
}

 window.requestAnimationFrame(moveAnimation)

requestIdleCallback：浏览器空闲时去执行，常用于低优先级的长任务，但执行时机不确定哦