Edge caching with Cloudflare + Next.js, the right way

The fastest response is the one you never compute. Edge caching puts your rendered HTML a few milliseconds from every visitor — and from Googlebot. The trick is invalidating it correctly.

Cache the HTML, revalidate on change

Use stale-while-revalidate so visitors always get an instant response while the edge refreshes in the background.

return new Response(html, {
  headers: {
    "Cache-Control": "public, s-maxage=3600, stale-while-revalidate=86400",
  },
});

Purge on publish, not on a timer

Tag your cache entries and purge by tag when content changes. Time-based expiry alone means either stale pages or wasted compute.

Cache aggressively, invalidate precisely. Everything good about the edge depends on getting the second half right.