A Next.js app grows, traffic climbs, and suddenly the API bill — or the database one — is the fastest-growing line item. The usual cause isn’t traffic itself; it’s the same data being fetched far more often than it changes.
Cache by how often data updates
If every page load hits an external API or database for data that updates hourly, you’re paying for thousands of identical requests. Next.js gives you layers: cache fetch responses, use Incremental Static Regeneration to rebuild pages on a schedule instead of per request, and cache expensive queries. Data that changes hourly should be fetched hourly, not on every visit.
Kill waterfalls and duplicate calls
Components that each fetch the same thing, or fetch sequentially when they could run in parallel, multiply requests. Fetch shared data once, higher up, and pass it down.
Move work to the server, too. Fetching from the client means each user’s browser hits your API directly — and you can’t cache across users. Server Components and server-side fetching let you fetch once and reuse the result. And request only what you need: pulling full objects when you use three fields wastes bandwidth and, on metered APIs, money.
Most cost blowups come down to one habit: treating data that rarely changes as if it changes every request. Cache by how often data actually updates and the bill usually drops sharply.