HMR (Hot Module Replacement)

Testing 🟢 Junior

Definition

Technologie qui remplace les modules modifies dans le navigateur sans recharger la page, preservant l'etat de l'application. Accelere considerablement le cycle de developpement.

Analogie

Comme changer une roue sur une voiture en mouvement : vous remplacez la piece sans arreter le moteur ni perdre votre position.

Exemple de code

// Vite: HMR natif, rien a configurer
// Modifiez un fichier -> mise a jour instantanee

// React Fast Refresh preserve l'etat
// des hooks et composants
// Webpack: necessite config + plugin HMR
// Vite: marche out-of-the-box

Cas d'usage

Pendant le developpement pour voir instantanement les changements sans perdre l'etat de l'app (formulaires, navigation).

Anti-pattern

Desactiver HMR et recharger la page manuellement, perdant du temps et de l'etat a chaque modification.
#dx#tooling#frontend