When should I extract a new React component?
When you see the same JSX structure repeated in real places. Extracting reduces duplication. But avoid premature abstraction; do not extract until the repetition is clear, or you create abstractions that fit only one case.
Verify This Answer
Cross-check this information using these trusted sources:
More FAQs in React Component Composition Best Practices for Clean Code
Because composition scales better. Instead of extending base components and creating rigid hierarchies, you build small focused components and combine them. This is more flexible and easier to change as the app grows.
The children prop lets you pass nested elements into a component. A Card component that renders its children is reusable for any content, instead of being hardcoded to specific elements.
There is no fixed number, but a component with around fifteen props is usually doing too much. If you are passing many props, consider splitting the component or grouping related props into an object.
Still have questions?
Browse all our FAQs or reach out to our support team