Modifier plusieurs propriétés CSS en 1 seule fois

Ce que dit le référentiel

Pour limiter le nombre de repaint/reflow, il est conseillé de ne pas modifier des propriétés une à une. Préférer l’ajout/la suppression de classes CSS, ce qui permet de modifier en une seule fois plusieurs propriétés, tout en ne générant qu’un repaint/reflow (voir la bonne pratique n° 45).

Notre avis

Le Virtual DOM de React optimise les manipulations et mises à jour en batchant les modifications avant de les appliquer au réel DOM. Cela permet de limiter les repaints et reflows, car les changements sont effectués de manière groupée.

Concrètement, en utilisant le Virtual DOM avec React, nous pouvons modifier plusieurs propriétés CSS simultanément par l'application d'une unique classe, réduisant ainsi l'impact sur la performance et l'empreinte environnementale du site.