Keep state as close as needed to components, use appropriate state management tools (Context, Redux) for global state, implement proper state updates, avoid unnecessary state, and consider state normalization.
Implement error boundaries, handle async errors properly, provide meaningful error messages, implement proper error logging, and maintain graceful degradation of functionality.
Use controlled components when needed, implement proper validation, handle form state efficiently, manage form submissions properly, and consider form library usage for complex forms.
Implement proper data fetching patterns, handle loading and error states, implement caching strategies, maintain proper separation of concerns, and consider API state management.
Use appropriate styling solution (CSS Modules, Styled Components), maintain consistent styling patterns, implement proper theme handling, and consider style organization.
Use TypeScript or PropTypes, implement proper type definitions, maintain type consistency, handle type edge cases, and consider type inference optimization.
Handle mounting/unmounting properly, implement proper cleanup, manage side effects correctly, handle updates efficiently, and consider performance implications.
Implement proper component composition, create reusable hooks, maintain proper abstraction levels, implement proper HOC patterns, and consider code sharing strategies.
Use proper state update patterns, handle async state updates correctly, implement proper batching, maintain immutability, and consider state update optimization.
Implement proper storage strategies, handle state rehydration, manage persistence lifecycle, consider offline support, and implement proper persistence patterns.
Use React DevTools effectively, implement proper logging, handle error tracking, maintain debugging tools, and consider debugging strategies.
Key principles include: single responsibility, reusability, proper prop drilling avoidance, composition over inheritance, and proper component hierarchy. Components should be small, focused, and maintainable.
Prevent XSS attacks, handle sensitive data properly, implement proper authentication/authorization, validate inputs, and consider security implications in data handling.
Use React.memo for expensive components, implement proper key usage, avoid unnecessary re-renders, use proper dependency arrays in hooks, lazy load components, and implement code splitting.
Use appropriate hooks (useEffect) for side effects, implement proper cleanup, handle async operations correctly, avoid side effects in render, and maintain clear separation of concerns.
Test component behavior not implementation, use proper testing libraries (RTL), implement meaningful assertions, maintain test isolation, and follow testing pyramid principles.
Use prop types or TypeScript, implement proper prop validation, avoid excessive props, use proper prop naming, and consider prop drilling alternatives.
Organize by feature/domain, maintain clear folder structure, implement proper module boundaries, follow consistent naming conventions, and maintain clear component hierarchy.
Follow ARIA guidelines, implement proper keyboard navigation, maintain proper heading hierarchy, provide proper alt texts, and implement proper focus management.
Use context appropriately for global state, implement proper provider organization, optimize context updates, avoid context overuse, and consider performance implications.
Implement proper performance metrics, use React DevTools effectively, monitor render performance, track user interactions, and consider performance optimization strategies.
Implement proper lazy loading, use dynamic imports effectively, handle loading states, optimize bundle size, and consider code splitting strategies.
Implement proper JSDoc comments, maintain clear prop documentation, document component usage, provide examples, and consider documentation maintenance strategies.
