React: What is React 19 cache() for request memoization?

cache() memoizes values per request (server components).

Code:

1import { cache } from "react";
2
3const getUser = cache(async (id: string) => {
4  const response = await fetch(`/api/users/${id}`);
5  return response.json();
6});
7
8async function UserPage({ params }) {
9  const user = await getUser(params.id);
10  const profile = await getUser(params.id); // cached!
11
12  return (
13    <div>
14      <h1>{user.name}</h1>
15      <p>{profile.bio}</p>
16    </div>
17  );
18}

How it works:

1. First call → executes, stores result
2. Subsequent calls with same args → returns cached
3. Cache is per-request
4. Cleared after request

Benefits:

• Eliminates duplicate calls
• Works across server components
• Request-scoped

vs useMemo:

• useMemo: client-side
• cache(): server-side

vs useEffect:

• useEffect: after render
• cache(): during render