back to catalog
rAF in rendering stage

    setTimeout(() => {
      console.log('setTimeout callback')
    })
    
    Promise.resolve().then(() => {
      console.log('promise callback before rAF')
    })

    console.log('before trigger rAF')

    const rAF = window.requestAnimationFrame(() => {
      console.log('execute rAF')
    })

    Promise.resolve().then(() => {
      console.log('promise callback after rAF')
    })
      
    setTimeout(() => {
      window.cancelAnimationFrame(rAF)
      console.log('calcel rAF')
    }, 20)
  
result1: before trigger rAF promise callback before rAF promise callback after rAF setTimeout callback execute rAF calcel rAF result2: before trigger rAF promise callback before rAF promise callback after rAF setTimeout callback calcel rAF result3: before trigger rAF promise callback before rAF promise callback after rAF execute rAF setTimeout callback calcel rAF