Debounce, Throttle and RequestAnimationFrame

565 2018-08-06 11:58

These are web techniques to optimize UI events handling and make transitions smoother.

  • debounce: Grouping a sudden burst of events (like keystrokes) into a single one.
  • throttle: Guaranteeing a constant flow of executions every X milliseconds. Like checking every 200ms your scroll position to trigger a CSS animation.
  • requestAnimationFrame: a throttle alternative. When your function recalculates and renders elements on screen and you want to guarantee smooth changes or animations. Note: no IE9 support.

What is the difference between debounce and throttle? try here

If you find this article helpful

follow me on Github :)

Download TianPan.co App

Learn startup engineering anywhere, anytime

© 2020 Tian
Built with in San Francisco