React.useEffect variants

useDebounceEffect.ts

import { useEffect } from "react"
function useDebounceEffect(effect: () => void, deps: unknown[], delay: number) {
  useEffect(() => {
    const timeout = setTimeout(() => {
      effect()
    }, delay)
    return () => {
      clearTimeout(timeout)
    }
  }, [...(deps || []), delay])
}

useThrottleEffect.ts

import { useEffect, useRef } from "react"
function useThrottleEffect(effect: () => void, deps: unknown[], delay: number) {
  const lastTime = useRef<number>(Date.now())
  useEffect(() => {
    const now = Date.now()
    if (now - lastTime.current >= delay) {
      effect()
      lastTime.current = now
    }
  }, [...(deps || []), effect, delay])
}