- Published on
How I Cut Costly Bandwidth Spikes by Disabling Nuxt Link Prefetch
- Authors
The Discovery: An Unexpected Spike in Bandwidth
The other day, I was optimizing a Nuxt 3 project I inherited—and noticed weird spikes in “Fast Data Transfer” on Vercel. The app wasn’t doing anything heavy, yet the network usage seemed excessive.
One clue stood out: every internal link was preloading content the moment it entered the viewport.
Turns out, Nuxt’s nuxt-link prefetch feature was preloading numerous chunks—turning simple page navigation into a bandwidth-hungry process :contentReference[oaicite:0]0.
What I Found: Prefetching Isn't Free
By default, Nuxt enables smart prefetching—that means when a <nuxt-link> appears on screen, it automatically fetches that page’s code. It uses IntersectionObserver and requestIdleCallback, which is clever—but in larger apps with many links, it leads to a flood of unnecessary network requests :contentReference[oaicite:1]1.
This accidental behavior meant users triggered dozens of page fetches just by scrolling. All that ended up on my Vercel bill.
The Fix: Disable Prefetch Globally
I needed a quick and effective way to stop it. A look at the docs revealed we can disable prefetch across the board in nuxt.config.ts:
export default defineNuxtConfig({
experimental: {
defaults: {
nuxtLink: {
prefetch: false,
},
},
},
})
Or, more simply:
export default {
router: {
prefetchLinks: false,
},
}
Both methods prevent Nuxt from injecting <link rel="prefetch"> tags for page chunks ([Nuxt][1], [Medium][2]).
Results: Faster, Leaner, and Cheaper
- Bandwidth usage dropped significantly
- Vercel “Fast Data Transfer” costs normalized
- Page performance stayed fast—without wasted fetches
- More control over what actually gets prefetched
Lessons Learned
- Inherited defaults—especially features like smart prefetch—can stealthily drain bandwidth.
- Nuxt gives you control—disable prefetch globally when you value budget over ultra-aggressive navigation performance.
- For high-link-volume pages, disable by default and opt-in manually on critical links.
- Vercel’s cost dashboard helped me trace the issue fast—a crucial part of the optimization process.