async await generator loop for requestAnimationFrame

asyncAnimationFrame.js

async function* asyncAnimationFrame () {
  const h = {}
  h.promise = new Promise(r => h.resolve = r)
  h.flipFrame = () => {
    h.resolve()
    h.promise = new Promise(r => h.resolve = r)
  }
  try {
    while (true) {
      h.idAF = requestAnimationFrame(h.flipFrame)
      yield await h.promise
    }
  } finally {
    h.resolve()
    cancelAnimationFrame(h.idAF)
  }
}

// example
(async () => {
  const flamer = asyncAnimationFrame()
  let flag = 0
  let now = Date.now()
  let bef
  while (flag < 100) {
    await flamer.next()
    bef = now
    now = Date.now()
    flag++
    console.log(now - bef)
  }
})()

https://beta.observablehq.com/@itacirgabral/asyncanimationframe