Current Server Time: 2025-11-30T10:13:40.721Z
This page is NOT cached - it's fully dynamic and regenerates on every request. This demonstrates RSC (React Server Components) without caching.
Cache Revalidation Methods
Three different approaches to invalidate cached content:
revalidateTag()
Soft revalidation (SWR) - serves stale content while revalidating in background
updateTag()
Hard revalidation - immediately expires cache, blocks until fresh data loads
revalidatePath()
Invalidates all routes under a path (including nested routes)
revalidatePath('/products', 'layout')
Individual Product Revalidation
Legend
SoftStale-while-revalidate - shows cached content immediately while fetching fresh data in background
HardBlocking reload - waits for fresh data before showing content
UpdateSimulates data update + cache revalidation (random stock value)
How to Test
- Visit the Products page and note the "Data Fetched" timestamp
- Refresh the products page - the timestamp stays the same (cached!)
- Come back here and click "Revalidate All Products"
- Go back to the products page and refresh - you'll see a new timestamp (cache was invalidated!)
- Try viewing a specific product at /products/1
- Use "Revalidate Product 1" to invalidate just that product's cache
- Notice how the product detail page uses PPR - the product data is cached but the "Current Server Time" updates on every request
Key Concepts
- Server Actions: All revalidation actions use
"use server" to execute on the server - Tag-Based Revalidation: We use
cacheTag() to tag cached content and revalidateTag() to invalidate specific caches - Path-Based Revalidation:
revalidatePath(path, type) invalidates cached content for a path. Use type="page" for a single page or type="layout" to revalidate all pages under that path (including nested routes). - Soft Revalidation (revalidateTag):
revalidateTag(tag, "max") uses stale-while-revalidate. The next request gets cached (stale) content immediately while fresh data is fetched in the background. Subsequent requests get the fresh data.
Note: In local development with `vc dev`, this may behave like hard revalidation. Deploy to Vercel to see true SWR behavior. - Hard Revalidation (updateTag):
updateTag(tag) immediately expires the cache. The next request will block and wait for fresh data to be fetched - no stale content is served. Can only be used in Server Actions.