#14useDebounce vs useThrottle
30min

Overview

Create two custom hooks, useDebounce and useThrottle, to manage the frequency of function executions.

Requirements

  • Implement two custom hooks:
    • useDebounce(value, delay)
      • Returns the updated value only after the specified delay has passed without further changes.
    • useThrottle(value, limit)
      • Returns the updated value at most once every limit milliseconds, regardless of how many times the original value changes during that period.
  • Both hooks should correctly handle rapid state changes without causing unnecessary re-renders.

Notes

  • Use the DELAY constant from constants.ts for both hooks.

Tests

  1. increments debounced and normal counters correctly
  2. increments throttled and normal counters correctly
  3. resets debounced and throttled counters instantly on Clear