'time''use cache' OUTside of the component
Time: 12/2/2025, 6:15:27 PM
'time''use cache' INSide of the component
Time: 12/2/2025, 6:15:27 PM
'use cache' OUTside Revalidate every 10 seconds.
Name: John Doe
Email: john@example.com
Fetch Date: 12/2/2025, 6:15:28 PM
Tagged with: 'server-action-user-1'
'use cache' INSide Revalidate every 10 seconds.
Name: John Doe
Email: john@example.com
Fetch Date: 12/2/2025, 6:15:28 PM
Tagged with: 'server-action-user-2'
No Component-level caching applied. Applied 'use cache' in the 'fetchUser' OUTside of the function.
Name: Cached SA John Doe
Email: sa-john@example.com
Fetch Date: 12/2/2025, 6:15:28 PM
No Component-level caching applied. Applied 'use cache' in the 'fetchUser' INSIDE the function.
Name: Cached SA John Doe
Email: sa-john@example.com
Fetch Date: 12/2/2025, 6:15:28 PM
Server component (outer donut) wraps a client component (inner hole). The server layer is cached, but the client component remains interactive.
Server component (cached) wrapping a client component (not cached). The outer layer fetches data, inner layer is interactive.
{"id":1,"name":"John Doe","email":"john@example.com"}Client component below is NOT cached:
Tagged with: 'posts'
Use revalidateTag to invalidate specific cached components. Click a button and refresh to see updated content.
Click buttons to revalidate cached components using revalidateTag
Interactive component with 'use client'
Current Time:
2:20:10 PM
Interactive component with 'use client'
Current Time:
2:20:10 PM
This component uses 'use cache' and sleeps for 200ms before rendering.
Time: 1/28/2026, 2:20:11 PM
Tagged with: 'time'