Debounces async functions while canceling previous pending calls. Ideal for search inputs and live queries.

debounce-async.js

export function debounceAsync(fn, delay = 300) {
  let timer;
  let rejectPrev;

  return (...args) => {
    if (timer) clearTimeout(timer);
    if (rejectPrev) rejectPrev({ canceled: true });

    return new Promise((resolve, reject) => {
      rejectPrev = reject;

      timer = setTimeout(async () => {
        try {
          const result = await fn(...args);
          resolve(result);
        } catch (e) {
          reject(e);
        }
      }, delay);
    });
  };
}

Use case:

const search = debounceAsync(query => fetch(`/api?q=${query}`).then(r => r.json()), 300);