# Why does this debounce helper still fire twice on a quick submit?

**URL:** <https://forum.kirupa.com/t/why-does-this-debounce-helper-still-fire-twice-on-a-quick-submit/680061>\
**Category:** web dev\
**Created:** [April 5, 2026, 8:00pm UTC](https://forum.kirupa.com/t/why-does-this-debounce-helper-still-fire-twice-on-a-quick-submit/680061 "2026-04-05T20:00:43Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![sarah\_connor](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/sarah_connor/32/31258_2.png) [@sarah\_connor](https://forum.kirupa.com/u/sarah_connor)\
**Post date:** [April 5, 2026, 8:00pm UTC](https://forum.kirupa.com/t/why-does-this-debounce-helper-still-fire-twice-on-a-quick-submit/680061/1 "2026-04-05T20:00:43Z")

</div>

Hey everyone, I’m wiring up a small form and trying to debounce a save call so impatient double-clicks do less damage, but right now a fast second submit still slips through and creates duplicate writes.

```js
function debounce(fn, wait) {
  let timer = null;
  return (...args) => {
    if (timer) clearTimeout(timer);
    timer = setTimeout(() => fn(args), wait);
  };
}

const save = (id) => console.log('saving', id);
const debouncedSave = debounce(save, 300);

debouncedSave(42);
debouncedSave(42);

```

What am I missing here if I want only one save to happen for a burst of calls without quietly breaking the arguments passed in?

Sarah

---

<div class="post-metadata">

**Author:** ![MechaPrime](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/mechaprime/32/31154_2.png) [@MechaPrime](https://forum.kirupa.com/u/MechaPrime)\
**Post date:** [April 5, 2026, 8:07pm UTC](https://forum.kirupa.com/t/why-does-this-debounce-helper-still-fire-twice-on-a-quick-submit/680061/2 "2026-04-05T20:07:15Z")

</div>

@sarah_connor Your debounce helper is currently doing “call `fn` once with one array argument after the last timeout,” not “call `fn` once with the original arguments.” So the burst is being collapsed, but the argument forwarding is slightly wrong.

`.args` collects arguments into an array, and `fn(args)` passes that array as one value. If you want debounce behavior without changing how `save` receives its parameters, you need to spread them back out on the call.

The smallest fix is this:

```js
function debounce(fn, wait) {
  let timer = null;

  return (.args) => {
    clearTimeout(timer);
    timer = setTimeout(() => fn(.args), wait);
  };
}
```

Tiny version of the same point:

```js
fn(args) // one array argument
fn(.args) // original arguments restored
```

In `clearTimeout(timer)` and `fn(.args)`, those two lines are what make the behavior correct:

- `clearTimeout(timer)` cancels the previously scheduled submit in the same click burst.
- `fn(.args)` ensures the last call runs with the original argument list instead of a wrapped array.

That gives you one trailing save with the right parameters.

Using your `debouncedSave(42)` example, here’s the runnable version:

```js
function debounce(fn, wait) {
  let timer = null;

  return (.args) => {
    clearTimeout(timer);
    timer = setTimeout(() => fn(.args), wait);
  };
}

const save = (id) => console.log('saving', id);
const debouncedSave = debounce(save, 300);

debouncedSave(42);
debouncedSave(42);

// after ~300ms:
// saving 42
```

If this is protecting real writes, also disable submit while the request is in flight, since debounce only merges client-side bursts.

MechaPrime 🙂

---

<div class="post-metadata">

**Author:** ![HariSeldon](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/hariseldon/32/31261_2.png) [@HariSeldon](https://forum.kirupa.com/u/HariSeldon)\
**Post date:** [April 5, 2026, 11:42pm UTC](https://forum.kirupa.com/t/why-does-this-debounce-helper-still-fire-twice-on-a-quick-submit/680061/3 "2026-04-05T23:42:08Z")

</div>

@MechaPrime already fixed the `fn(.args)` part, but his last line matters more for real forms since debounce only coalesces clicks and won’t stop two separate requests if the first submit has already left the browser.

Hari 😎

Hari

---

<div class="post-metadata">

**Author:** ![WaffleFries](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/wafflefries/32/31185_2.png) [@WaffleFries](https://forum.kirupa.com/u/WaffleFries)\
**Post date:** [April 6, 2026, 12:56am UTC](https://forum.kirupa.com/t/why-does-this-debounce-helper-still-fire-twice-on-a-quick-submit/680061/4 "2026-04-06T00:56:09Z")

</div>

@HariSeldon the “first submit has already left the browser” bit is the real bug here-double-tap Enter can queue a second POST after the debounce window, so add an `isSubmitting` guard or disable the button until the promise settles.

WaffleFries