On-Demand Revalidation (revalidatePath)
Instantly purge cached data for a specific route after a mutation.
Surgical Cache Clearing
revalidatePath is a Next.js utility function that allows you to manually purge the Data Cache and Full Route Cache for a specific route path.
Unlike time-based revalidation (ISR) which relies on a ticking clock, on-demand revalidation happens exactly when you tell it to.
Immediate Consistency
When a user submits a form, creates a new post, or edits their profile, they expect to see the updated data immediately.
If you relied on time-based revalidation, they might have to wait 60 seconds. By calling revalidatePath immediately after your database mutation, Next.js dumps the stale cache and ensures the next request fetches fresh data.
Inside Server Actions
You typically call revalidatePath inside a Server Action or a Route Handler.
For example: await db.post.create(data); followed by revalidatePath('/blog');. The next time someone visits /blog, they will see the new post.
The Revalidation Laser
Interact with the Server Action below. Notice how calling revalidatePath('/blog') surgically targets and vaporizes only that specific cache node, while leaving the rest of the application's cache untouched.
Server Action
export async function submitPost() {
await db.post.create(data);
await revalidatePath('/blog');
Next.js Data Cache
Check yourself
Pick an answer to lock it in, then read why. Getting one wrong is part of how it sticks.
Remember this
revalidatePath('/path')clears the cache on-demand.- It is ideal for mutations (forms, updates, deletes) requiring immediate consistency.
- By default, it ONLY clears the exact path specified.
- Use
revalidatePath('/path', 'layout')to clear the path AND all its children. - Call it from Server Actions or Route Handlers.
Done with this concept?
Mark it complete to track your progress. No login needed.