Making Prefetch Smarter with Cloudflare Cache Awareness

When we talk about speeding up websites, prefetching often comes up. But most implementations just “blindly” preload links, which means a lot of wasted bandwidth and requests for content that never gets used.

I wanted to explore a smarter way: prefetch only when it makes sense.

That’s how this small script was born. It looks at Cloudflare’s cache response before prefetching, so you only fetch resources that are already cached at the edge. This means:

⚡ Faster responses (cache hits come back instantly).

💾 Less wasted bandwidth (no pointless preloads).

🛡️ Works with browser cache and service worker cache too.

It’s designed to be lightweight, plug-and-play, and tested on real-world projects.

Here’s a quick idea of how it works in practice:

// simplified demo

if (response.headers.get('CF-Cache-Status') === 'HIT') {

prefetch(link.href);

}

Instead of guessing, it only prefetches when you know the asset is “hot” and ready at Cloudflare’s edge.

---

📂 Project Repository

👉 Check out the full code here: GitHub

• https://github.com/AffluentWebMedia/cloudflare-prefetch-intent

• https://affluentwebmedia.github.io/cloudflare-prefetch-intent/