A page that loads its content from a JSON file feels slower than it should, and every single visit triggers a full fresh download of that file – even for a returning visitor loading the exact same, unchanged data.
Forcing cache: ‘reload’ on a fetch() Call Defeats Browser Caching on Every Visit
⚡ Quick Fix (TL;DR)
The Culprit: The fetch() call used { cache: 'reload' }, which explicitly forces the browser to bypass its own HTTP cache and hit the network every time, regardless of whether the file actually changed. This pattern got copy-pasted across several separate pages' data fetches – useful while actively editing that JSON during development, but left in place after launch it silently punishes every real visitor's load time for no benefit.
The Fix: Switch to the browser's default caching behavior – { cache: 'default' }, or just omit the option entirely – so returning visitors load the JSON from cache until it actually changes. Reserve cache: 'reload' for active development, never production.
// Forces a full re-download every time - fine while editing, bad live:
fetch(url, { cache: 'reload' })
// Lets the browser's own HTTP caching do its job:
fetch(url)Tagged in :