Virtual DOM

React 🟢 Junior

Définition

Représentation légère du DOM réel en mémoire. React compare l'ancien et le nouveau Virtual DOM pour ne modifier que ce qui a change.

Analogie

Comme un brouillon avant d'envoyer un email : tu fais tes corrections sur le brouillon, puis tu envoies seulement la version finale.

Exemple de code

// React cree un arbre virtuel
// Ancien: <p>Bonjour</p>
// Nouveau: <p>Salut</p>
// React ne change que le texte du <p>, pas tout le DOM

Cas d'usage

Mécanisme interne qui optimise les mises a jour du DOM sans intervention manuelle.

Anti-pattern

Manipuler le DOM directement avec document.querySelector au lieu de laisser React gérer.
#core#interview#performance

← → au clavier pour passer d'une fiche à l'autre