Understanding the timing of changes in the Sanity studio and their reflection on the front end.

When an editor publishes changes in Sanity Studio, the time it takes to see those changes on your Vercel-hosted frontend depends on your caching setup. Here's what's happening at each layer:

Sanity API CDN Layer

If you're using useCdn: true in your Sanity client, queries go through Sanity's API CDN (also called Live CDN), which uses intelligent caching with approximately 10-minute cache times. The CDN uses a stale-while-revalidate strategy (600 seconds), meaning it serves cached content while fetching fresh updates in the background.

However, the API CDN includes automatic cache invalidation - when you publish a document, Sanity automatically invalidates the cache for that content. In practice, this means updates typically propagate within seconds, though the CDN may occasionally serve slightly stale content (up to 10 minutes old) for improved performance and reliability.

Next.js + Vercel Layer

Your Next.js application adds another caching layer, and this is usually where the biggest delays happen:

Time-Based ISR (Incremental Static Regeneration)

If you're using time-based revalidation with a revalidate value:

export async function getStaticProps() {
  return {
    props: { /* your data */ },
    revalidate: 60 // Page regenerates after 60 seconds
  }
}

Changes appear after your revalidation period expires. The first visitor after that triggers a background regeneration, and subsequent visitors see the fresh content. So with revalidate: 60, you're looking at 60+ seconds before changes appear.

On-Demand Revalidation (Recommended for Fast Updates)

For near-instant updates, use on-demand revalidation with webhooks or Sanity Functions. Set up automation that calls revalidatePath() when content changes:

await res.revalidate('/blog/my-post');

With on-demand revalidation, changes typically appear within 1-5 seconds after publishing, as the revalidation triggers immediately and Vercel's edge network updates quickly.

Modern approach: Use Sanity Functions to handle revalidation directly within Sanity's infrastructure. Functions are serverless, event-driven modules that can respond to content changes and trigger your Vercel revalidation automatically - no external webhook infrastructure needed.

Best Practices for Fastest Updates

1. Implement on-demand revalidation: Use Sanity Functions or webhooks to trigger revalidation immediately when content changes
2. Consider disabling Sanity CDN for ISR: When using Next.js ISR, some developers set useCdn: false to avoid potential conflicts between the Sanity CDN cache and Next.js cache layers
3. Use appropriate revalidation times: For content that doesn't need instant updates, longer revalidation periods (e.g., 3600 seconds) reduce API requests while still keeping content reasonably fresh

Bottom Line

Without on-demand revalidation: Changes appear after your revalidate period expires (commonly 60-3600 seconds depending on your settings).

With on-demand revalidation: Changes appear in 1-5 seconds after hitting publish, making it feel nearly instant for editors.

The Sanity API CDN itself is quite fast with automatic cache invalidation, so the Next.js/Vercel caching layer is typically the determining factor for how quickly your editors see their changes live.