Next.js · Senior · Question 21 of 75
Why are Context providers in the App Router moved into a separate client component?
- ✓Correct answer: Context is a client feature; the layout renders a
<Providers>wrapper - 2Providers slow down server rendering, so they're turned off on the server
- 3Next.js forbids using Context inside any layout files
Explanation
createContext and providers are client features. You create providers.tsx with 'use client' and render it in the root layout around children. That way children stay server components. Providers are placed as deep as possible so more of the tree stays static.