What is React's use() hook in React 19?
Why Interviewers Ask This
This is a differentiating question used for senior and lead roles. Interviewers want to see if you can explain not just what happens, but why — and what the trade-offs are in different approaches.
Answer
The use() hook (React 19) is a new primitive that reads the value of a resource (a Promise or a Context) during rendering. Unlike all other hooks, use() can be called conditionally and inside loops — it is not bound by the rules of hooks in that regard. With Promises: const data = use(fetchDataPromise); — if the promise is pending, the component suspends (falls back to the nearest Suspense boundary); if resolved, returns the value; if rejected, throws to the nearest Error Boundary. This replaces the pattern of storing async data in state via useEffect. With Context: const theme = use(ThemeContext); — equivalent to useContext but callable conditionally. Server Action integration: in Next.js App Router, use() integrates with server-side data fetching, Suspense streaming, and React Server Components. Important: use() cannot be called in a try-catch or inside event handlers — only in component bodies or other hooks. It represents a fundamental shift in how React handles asynchronous data — from imperative loading state to declarative Suspense-based data fetching.
Common Mistake
Candidates often give textbook answers here. Interviewers are more impressed when you relate the concept to a specific problem you solved in a real React.js project.
Previous
How does React handle accessibility (a11y)?
Next
What is the React Activity (Offscreen) API?
More React.js Questions
View all →- Advanced How does React's reconciliation algorithm handle keys?
- Advanced What is the React Fiber architecture in depth?
- Advanced What are React rendering optimizations beyond React.memo?
- Advanced How do you implement an undo/redo system in React?
- Advanced What are React's concurrent features and how do Transitions work?