Module 4 : React Avancé
Ce module couvre les concepts avancés de React : optimisation des performances avec useMemo et useCallback, création de hooks personnalisés, et gestion d'état global avec Redux.
Prérequis
- Module 3 complété (useState, useEffect, useRef, useContext)
- Comprendre les closures JavaScript
- Comprendre les références vs valeurs
Chapitres
| # | Chapitre | Contenu | |
|---|---|---|---|
| 1 | useCallback et useMemo | Optimisation des performances et mémoïsation | |
| 2 | Custom Hooks | Créer vos propres hooks réutilisables | |
| 3 | Redux et Redux Toolkit | Gestion d'état global pour applications complexes |
Objectifs du module
À la fin de ce module, vous saurez :
- Optimiser les re-rendus avec useMemo et useCallback
- Identifier quand l'optimisation est nécessaire
- Créer des hooks personnalisés réutilisables
- Comprendre le pattern Redux (actions, reducers, store)
- Utiliser Redux Toolkit pour simplifier Redux
Quand utiliser ces concepts ?
| Concept | Cas d'usage |
|---|---|
| useMemo | Calculs coûteux, transformation de données |
| useCallback | Fonctions passées en props à des composants mémoïsés |
| Custom Hooks | Logique réutilisable entre composants |
| Redux | État partagé entre composants non reliés |
Avertissement sur l'optimisation
"Premature optimization is the root of all evil" - Donald Knuth
N'optimisez pas par défaut. React est déjà rapide. Utilisez ces outils seulement quand vous constatez un problème de performance réel.