Reference

Cache API

Mreact has separate cache surfaces for route HTML, browser assets, public files, and server-state query data. This page covers the route HTML cache and explicit route revalidation helpers.

When to use this page

Use this page when tuning HTML cache headers, choosing revalidate, invalidating cached pages after a mutation, or providing a custom route cache store for a deployment runtime.

Route HTML cache

export const revalidate = 60 sets cache-control: s-maxage=60, stale-while-revalidate for a route and stores eligible HTML in the configured route cache. Use revalidate = 0 when a route should explicitly send no-store.

// src/app/docs/page.tsx
export const revalidate = 60;

export default function Page() {
  return <main>Docs</main>;
}

Imperative cache control

Use cacheControl() inside a route render when the policy depends on loaded data.

import { cacheControl } from "@reckona/mreact-router";

export async function loader() {
  const post = await findPost();

  cacheControl({
    sMaxAge: post.published ? 300 : 0,
    staleWhileRevalidate: post.published ? 600 : false,
  });

  return { post };
}

Revalidation after mutations

revalidatePath() invalidates cached route HTML for a path. Server action responses can also carry x-mreact-revalidate so the client navigation cache drops stale prefetched HTML.

import { revalidatePath } from "@reckona/mreact-router";

export async function savePost(formData: FormData) {
  const post = await updatePost(formData);

  revalidatePath("/posts");
  revalidatePath(`/posts/${post.id}`);

  return post;
}

Route cache stores

Use createMemoryRouteCache() for local Node processes. Long-lived production deployments can provide an AppRouterCache implementation backed by platform storage.

import { createMemoryRouteCache } from "@reckona/mreact-router";
import { mreactRouter } from "@reckona/mreact-router/vite";

export default {
  plugins: [
    mreactRouter({
      routeCache: createMemoryRouteCache({ maxEntries: 5_000 }),
    }),
  ],
};