Throttle and Debounce

Whenever I need to use throttle or debounce I have to remind myself of the differences. Here are a few definitions as a reminder.

Throttle #

Creates a throttled function that only invokes func at most once per every wait milliseconds.
lodash throttle

Throttling enforces a maximum number of times a function can be called over time. As in "execute this function at most once every 100 milliseconds".
CSS-TRICKS

Debounce #

Creates a debounced function that delays invoking func until after wait milliseconds have elapsed since the last time the debounced function was invoked.
lodash debounce

Debouncing enforces that a function not be called again until a certain amount of time has passed without it being called. As in "execute this function only if 100 milliseconds have passed without it being called".
CSS-TRICKS

Demo #

I have a small demo here showing the difference between throttle and debounce when applied to key presses.