animationFrameScheduler
Animation Frame Scheduler
Perform task when window.requestAnimationFrame
would fire
When animationFrame
scheduler is used with delay, it will fall back to asyncScheduler scheduler
behaviour.
Without delay, animationFrame
scheduler can be used to create smooth browser animations.
It makes sure scheduled task will happen just before next browser content repaint,
thus performing animations as efficiently as possible.
Example
Schedule div height animation
// html: <div style="background: #0ff;"></div>
import { animationFrameScheduler } from 'rxjs';
const div = document.querySelector('div');
animationFrameScheduler.schedule(function(height) {
div.style.height = height + "px";
this.schedule(height + 1); // `this` references currently executing Action,
// which we reschedule with new state
}, 0, 0);
// You will see a div element growing in height
const animationFrameScheduler: AnimationFrameScheduler;