6

I know that after the emergence of React Hooks, functional components are able to act almost the same as the class components, and I have seen lately an encouragement wave to use functional components.

My question is, could it hurt in any means to have a hybrid react app with some functional components and some class components? I understand that react would not complain about it, but I am looking for an experienced best practices, did inconsistency with component's types cause any problems?

Any tips are appreciated.

Ahmed Hammad
  • 2,798
  • 4
  • 18
  • 35

2 Answers2

2

After sometime of using a hybrid project, I came to the conclusion that it is better to use functional components for the whole project. Not for any technical reason, but because of the community support.

Many of the packages today are made with functional components only (or mostly) in mind, having class components may require an additional workarounds to make it work.

Some packages creates a short-hand hooks for easier usage, eventually it becomes the official supported way for using the package, like what happened with react-alert.

Ahmed Hammad
  • 2,798
  • 4
  • 18
  • 35
0

Personally, I have function components that don't manage state and class components that do. However, this is not mandatory. With React hooks you can do everything with functions. It is your choice, it won't impact performance much. Functional components can be more performant when used right. Read more here

Dani
  • 556
  • 7
  • 23
  • May I ask whether using class components for stateful components has any perks over functional ones? Or is it just your personal preference? @Dani – Ahmed Hammad Jun 06 '20 at 19:21
  • It is my preference. I have heard that a better practice is to use only functional components since they are easier to test and debug. For every input (props), functional components have exactly one output. Also, functional components with react hooks are much easier to read – Dani Jun 06 '20 at 19:26