Principes des React Hooks
Arrêtez d'utiliser useEffect pour tout. De nombreux développeurs utilisent mal ce hook. Cela crée des bugs et rend le code difficile à lire.
Limitez l'utilisation de useEffect.
Essayez d'utiliser un seul useEffect par page. Utiliser de nombreux hooks pour le même état provoque de la confusion. On perd le fil de quel hook met à jour quel état.
Arrêtez d'utiliser useEffect pour les événements utilisateur.
N'utilisez pas useEffect pour les clics ou les pressions tactiles. Utilisez plutôt des gestionnaires d'événements.
- Mauvais : Utiliser useEffect pour mettre à jour l'état après un clic.
- Bon : Utilisez une fonction comme onClickBar pour mettre à jour l'état.
Types d'événements que vous devriez connaître :
- La navigation de page et les rendus initiaux.
- Les changements de connexion réseau.
- Les mises à jour WebSocket ou serveur en temps réel.
Les actions utilisateur comme les clics n'ont pas leur place dans useEffect. Utilisez des gestionnaires d'événements directs pour ces actions.
Divisez vos composants par props.
Si vous utilisez une prop booléenne pour modifier la logique, divisez votre composant. Ne créez pas un composant unique qui gère à la fois la création et la mise à jour des données.
Un composant unique avec de nombreuses instructions "if" devient trop volumineux. Cela rend l'application difficile à maintenir.
- Mauvais : Un composant avec une prop "isAdd" qui modifie les champs du formulaire.
- Bon : Créez un "RegisterComponent" et un "UpdateComponent".
Les petits composants sont plus faciles à tester. Ils s'exécutent plus rapidement. Ils restent propres.
Source : https://dev.to/kkr0423/reactjs-the-principle-of-the-hook-3c31