Throttle

ELI5 — The Vibe Check

Limiting how often a function can fire. Unlike debounce (which waits until you STOP), throttle fires at a steady rate no matter how fast you trigger it. Perfect for scroll events — instead of firing 60 times per second, throttle it to once every 100ms. Your browser will thank you.

Real Talk

Throttling limits a function's execution to at most once per specified time interval, regardless of how many times it's invoked. Unlike debouncing, it guarantees regular execution during continuous activity. It's ideal for scroll handlers, resize events, and mousemove tracking where periodic updates are needed.

Show Me The Code

function throttle(fn, limit) {
  let throttled = false
  return (...args) => {
    if (!throttled) {
      fn(...args)
      throttled = true
      setTimeout(() => throttled = false, limit)
    }
  }
}

// Fires at most once per 100ms during scroll
window.addEventListener('scroll', throttle(onScroll, 100))

When You'll Hear This

"Throttle the scroll handler to 100ms — it's janking." / "Debounce for search, throttle for scroll — don't mix them up."