Types of components?

0-2 years experience

1. 1How would you decide whether to implement a simple toggle button as a function component or a class component?
2. 2If you create a presentational component that only renders UI, what props would you pass to keep it reusable across different pages?
3. 3What happens if you try to use state inside a functional component without using hooks?

2-5 years experience

1. 1We have a dashboard with a data‑fetching container component and several UI widgets. How would you structure the components, and why might you choose container vs presentational patterns?
2. 2During a code review a teammate converted a class component to a functional one but forgot to memoize a heavy child component, causing a slowdown. How would you diagnose and fix the regression?
3. 3You need to add a higher‑order component to inject authentication info into several pages. What trade‑offs should you consider compared to using React context?

5-8 years experience

1. 1Our app renders a large list with infinite scroll. Discuss the component architecture—pure components, memo, virtualization—you would use to keep rendering performant at scale.
2. 2We are migrating a legacy codebase that heavily uses class components and lifecycle methods to modern hooks. What migration strategy would you adopt to minimize risk and maintainability?
3. 3Design a reusable modal component that works across multiple teams, handling focus management, portal rendering, and theming while avoiding prop‑drilling.

8+ years experience

1. 1At a company‑wide level we want to standardize component types (functional, class, HOC, render props) across dozens of repositories. How would you set up guidelines, tooling, and migration paths to enforce consistency without slowing feature velocity?
2. 2Discuss the long‑term architectural implications of favoring higher‑order components versus hooks for cross‑cutting concerns in a large micro‑frontend ecosystem.
3. 3If you need to support both legacy browsers that don’t understand hooks and modern browsers, how would you structure your component library to serve both without duplicating code?