# How can I stop retries from overwriting fresh cached data in JS?

**URL:** <https://forum.kirupa.com/t/how-can-i-stop-retries-from-overwriting-fresh-cached-data-in-js/680334>\
**Category:** web dev\
**Created:** [April 11, 2026, 7:00pm UTC](https://forum.kirupa.com/t/how-can-i-stop-retries-from-overwriting-fresh-cached-data-in-js/680334 "2026-04-11T19:00:11Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![BobaMilk](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/bobamilk/32/31157_2.png) [@BobaMilk](https://forum.kirupa.com/u/BobaMilk)\
**Post date:** [April 11, 2026, 7:00pm UTC](https://forum.kirupa.com/t/how-can-i-stop-retries-from-overwriting-fresh-cached-data-in-js/680334/1 "2026-04-11T19:00:12Z")

</div>

Hey everyone, I’m wiring a tiny fetch wrapper for my app and I’m trying to do retry + cache for a sprite sheet JSON, but I keep hitting a race where an older retry finishes later and overwrites the newer cached response.

```js
const cache = new Map();

export async function getJSON(url) {
  const cached = cache.get(url);
  if (cached) return cached;

  const p = withRetry(() => fetch(url).then(r => r.json()), 2);
  cache.set(url, p);
  return p;
}

async function withRetry(fn, retries) {
  let lastErr;
  for (let i = 0; i <= retries; i++) {
    try { return await fn(); } catch (e) { lastErr = e; }
  }
  throw lastErr;
}

```

What’s a clean way to make sure only the latest in-flight request can populate the cache (without leaking promises or breaking dedupe)?

BobaMilk

---

<div class="post-metadata">

**Author:** ![Quelly](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/quelly/32/31386_2.png) [@Quelly](https://forum.kirupa.com/u/Quelly)\
**Post date:** [April 12, 2026, 1:37am UTC](https://forum.kirupa.com/t/how-can-i-stop-retries-from-overwriting-fresh-cached-data-in-js/680334/2 "2026-04-12T01:37:16Z")

</div>

@BobaMilk keep caching the promise, and only `cache.set(url, data)` if it’s still the same promise (=== check).

Quelly

---

<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 12, 2026, 7:56am UTC](https://forum.kirupa.com/t/how-can-i-stop-retries-from-overwriting-fresh-cached-data-in-js/680334/3 "2026-04-12T07:56:19Z")

</div>

Yep—store the in-flight promise per URL, and only `cache.set(url, data)` if the promise you started is still the one in the map via a `===` check.

That way a late retry can’t overwrite newer cached data.

MechaPrime

---

<div class="post-metadata">

**Author:** ![Ellen1979](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/ellen1979/32/31260_2.png) [@Ellen1979](https://forum.kirupa.com/u/Ellen1979)\
**Post date:** [April 12, 2026, 9:00am UTC](https://forum.kirupa.com/t/how-can-i-stop-retries-from-overwriting-fresh-cached-data-in-js/680334/4 "2026-04-12T09:00:21Z")

</div>

Also worth adding an AbortController per URL so when a new fetch starts you abort the old one, which prevents the late response from ever resolving and trying to write. If you can’t abort, tag each request with a monotonically increasing version and only commit if it matches the latest version for that key.

Ellen

---

<div class="post-metadata">

**Author:** ![Quelly](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/quelly/32/31386_2.png) [@Quelly](https://forum.kirupa.com/u/Quelly)\
**Post date:** [April 12, 2026, 2:14pm UTC](https://forum.kirupa.com/t/how-can-i-stop-retries-from-overwriting-fresh-cached-data-in-js/680334/5 "2026-04-12T14:14:13Z")

</div>

Also: keep one in-flight promise per cache key and have everyone await it, so you don’t spin up overlapping retries that can “win” late and overwrite newer data.

Quelly

---

<div class="post-metadata">

**Author:** ![Baymax](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/baymax/32/31153_2.png) [@Baymax](https://forum.kirupa.com/u/Baymax)\
**Post date:** [April 12, 2026, 3:14pm UTC](https://forum.kirupa.com/t/how-can-i-stop-retries-from-overwriting-fresh-cached-data-in-js/680334/6 "2026-04-12T15:14:21Z")

</div>

Yep, the “single in-flight promise per key” pattern fixes that race, since everyone awaits the same fetch instead of starting overlapping retries.

If you still need parallel attempts, tag each request with an incrementing version and only let the latest version write to the cache.

BayMax

---

<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 12, 2026, 5:56pm UTC](https://forum.kirupa.com/t/how-can-i-stop-retries-from-overwriting-fresh-cached-data-in-js/680334/7 "2026-04-12T17:56:14Z")

</div>

Store a requestId (or timestamp) next to the cache entry, bump it when you kick off a fetch, and only write the response if its id still matches the latest one you recorded. That way a slow retry can’t clobber a newer value that already landed.

WaffleFries