react-patterns

The use() hook reads resources like Promises during render, while useFormStatus provides status information within a form. Both are React 19 patterns that simplify state management and form handling without manually managing lifecycle events.

React Server Components execute on the server to render components, reducing the client-side JavaScript bundle size. They improve performance optimization by fetching data server-side before sending HTML to the browser.

Yes, useOptimistic allows you to implement optimistic UI updates by showing the expected state immediately while asynchronous Actions process in the background. It automatically reverts to the actual state once the server response resolves.

useFormState manages form submission state by invoking a server Action and returning the response data. It pairs naturally with useFormStatus to track pending states during form handling in modern TypeScript applications.

The React Compiler automatically optimizes re-renders, but it is not strictly required for concurrent features or Suspense. You can still manually optimize performance using hooks like useMemo while leveraging server-side rendering capabilities.

You should avoid Server Components when a component requires heavy user interactivity, direct browser API access, or complex client-side event listeners. In these cases, standard client components maintain better interactive performance.