CDN vs APICDN difference in Sanity and stale-while-revalidate caching

Based on your question, I can clarify the difference between these endpoints and help with your caching concerns.

CDN Endpoints Explained

There are indeed different CDN endpoints in Sanity, and they serve different purposes:

• apicdn.sanity.io - This is the API CDN used for caching API responses (your GROQ queries and document data). It provides unlimited rate for cached content and is optimized for delivering JSON API responses.

• cdn.sanity.io - This is the Asset CDN specifically for serving media files like images, videos, and other uploaded assets. It's built on Google Cloud CDN and handles asset transformations and caching.

• api.sanity.io - This is the non-cached API endpoint that always fetches fresh data from the Content Lake.

So when you're using the Nuxt Sanity module with useCDN: true, it's correctly using cdn.sanity.io for assets (images, files) and should be using apicdn.sanity.io for API queries. These are two different systems working together.

About the Duplicate Fetching Issue

If you're seeing the same asset fetched multiple times during component refreshes, this is likely a client-side issue rather than a CDN configuration problem. The Asset CDN caches indefinitely once an asset is processed, and uses content-addressable URLs (with SHA-1 hashes) that enable aggressive browser caching.

A few things to check:

1. Make sure your asset URLs are stable - If the URL changes on each render (different transform parameters, for example), it will be treated as a new request
2. Check your browser's cache headers - The Asset CDN supports Cache-Control, If-Modified-Since, and If-None-Match headers
3. Verify you're not disabling cache in development - Some dev tools or configurations disable caching

Adjusting Stale-While-Revalidate

For the API CDN (apicdn.sanity.io), the cache behavior is controlled server-side by Sanity and uses stale-while-revalidate by default. You don't have direct control over the cache duration from the client side - this is managed by Sanity's infrastructure to balance freshness with performance.

If you need more control over caching behavior, you might want to implement your own caching layer (like using Nuxt's built-in caching features or a service worker) on top of Sanity's CDN.

The Asset CDN (cdn.sanity.io) caches assets indefinitely since they're content-addressed, so those shouldn't need adjustment - they're already maximally cached.