[Dúvida] Functional component VS Class component, quando usar cada um deles?

Fala galera, em um dos projetos que estou trabalhando me deparei com um problema relacionado à decisão de qual tipo de componente criar: uma classe, ou uma função.

Como ainda estou aprendendo o básico de front, fiz uma rápida pesquisa, e o resumo foi:

  • Se o componente possui estado, use class component
  • Se o componente não possui estado, use functional component

Entendo que existem questão de desempenho entre os dois, mas, se tratando apenas da questão de estado, é correto utilizar essa regra?

Penso nisso porque já me deparei com functional components utilizando useState, mas me pergunto se foi uma gambiarra ou se a regrinha ai de cima não é tão verdadeira.

Valeu!

Eu atualmente trabalho com React no front-end e, sendo um desenvolvedor com alguma experiência anterior em Java em projetos pessoais tanto Android (quando o Java ainda era a linguagem de desenvolvimento "oficial" para ele) como desktop, eu prefiro usar componentes baseados em classe. Mas reconheço que classe em Javascript é apenas um "syntactic sugar" que foi inaugurado no ES6, se não me engano. Por trás dos panos, o Javascript ainda é uma linguagem baseada em funções de primeira classe.

Esse tipo de regra era usado quando apenas componentes classe podiam ter estado e ciclo de vida no React. Hoje em dia, sempre use componentes funcionais, porque é o padrão. Raramente você precisará usar um componente classe.

Desde o lançamento dos hooks, só me lembro de ter precisado usar componente classe uma vez, para customizar uma transição numa biblioteca de React Native que não tinha atualizado para componentes funcionais.

Segundo a documentação oficial do React, o ideal é sempre usar as Functional Components, as classes foram uma forma usada no passado, hoje com os Hooks já não é mais necessário.