L’accès au DOM (Document Object Model) est coûteux en termes de ressources processeur (cycles CPU). Aussi, lorsque vous utilisez plusieurs fois le même élément du DOM depuis JavaScript, stockez sa référence dans une variable afin de ne pas parcourir à nouveau le DOM pour ce même élément.

Le "Référentiel d'écoconception web (REW)" est publié par GreenIT.fr dans le cadre des travaux du Collectif conception numérique responsable selon les termes de la licence Creative Commons Attribution.

Plus d'informations sur collectif.greenit.fr et ecoconceptionweb.com.

Notre avis

React.js utilise un virtual DOM pour minimiser les accès directs au DOM. Grâce à cette structure, les modifications sont d'abord appliquées au virtual DOM. Ensuite, React détermine les différences entre le virtual DOM et le DOM réel, et n'applique que les changements nécessaires.

Cette approche réduit les cycles CPU car elle évite les nombreuses re-rendu coûteux des éléments souvent accédés. En utilisant React, les références à ces éléments sont efficacement gérées par ses algorithmes, limitant ainsi les besoins de stockage manuel dans des variables.

Règle de validation

Le nombre de données constantes (ou non volatiles) récupérés à plusieurs reprises sans être mises en cache doit être inférieur ou égal à 0

Ressources économisées

Processeur

Bonne pratique précédente

Bonne pratique suivante