What are the advantages of stateless components?

It may seem tempting to only use stateful class components and develop a whole application like that. Why would we even bother with stateless functional components? The answer is performance. Stateless functional components can be rendered faster. One of the reasons why this is the case is because stateless functional components do not require some of the life cycle hooks.

Please note that if you are using React v16 or later, it is not true that functional components are wrapped into class components internally within the React library:

Functional components are faster, but in most cases are outperformed by class components extending React.PureComponent:

Functional components are not only more concise, but they usually are also pure functions. We will explore this concept further in Chapter 9, Elements of Functional Programming Patterns. Pure functions provide a lot of benefits, such as a predictable UI and easy tracking of user behavior. The application can be implemented in a certain way to record user actions. Such data helps with debugging and reproducing errors in tests. We will dig into this topic later on in this book.