react

React 19 hooks patterns use useState, useEffect, useCallback, useMemo, and useRef with TypeScript type-safe props and explicit prop interfaces. Define component signatures without React.FC, export as default, and leverage the new JSX transform for modern component design with proper typing and stable references.

Optimize React performance by using useCallback for stable function references, useMemo for expensive computations, and React.memo for preventing unnecessary re-renders. Combine these patterns with TypeScript generics to maintain type safety while reducing render cycles across large component trees.

Code splitting in React uses lazy loading with Suspense boundaries to load components on demand. Wrap lazy-loaded components with <Suspense> and provide fallback UI, enabling efficient bundle splitting and improved initial load performance for large applications.

Yes. React 19 supports direct function components with explicit prop interfaces instead of React.FC. Type props as separate interfaces, use the new JSX transform, and export components as default functions for cleaner, more maintainable TypeScript React code.

React 19 breaking changes include JSX transform updates, prop interface requirements, and removal of certain legacy patterns. This Skill covers migration strategies, TypeScript typing adjustments, and modern hook patterns to ensure robust error handling and compatibility across projects.

Suspense boundaries wrap lazy-loaded components and provide fallback UI while data loads. Combine with error boundaries to handle failures gracefully, ensuring robust error handling and controlled loading states across async component rendering in React applications.