What are the differences between class and functional components in React?

What are the main differences between class and functional components in React?

Class components are ES6 classes that extend React.Component, while functional components are simpler functions. Class components can hold state and lifecycle methods, whereas functional components use hooks for state and side effects.

Can you explain when to use one over the other?

Use class components when you need lifecycle methods or state management in older React code. Functional components are preferred for new code due to their simplicity and the power of hooks.

What are hooks and how do they relate to functional components?

Hooks are functions that let you use state and other React features in functional components. They allow you to manage state and side effects without converting to class components.

Are there any performance differences between the two?

Functional components can be more performant due to their simpler structure and the ability to use React.memo for optimization. However, the performance difference is often negligible for most applications.