why-did-you-render

React 🟡 Mid

Definition

Librairie de debugging qui alerte dans la console quand un composant se re-rend inutilement (memes props mais nouvelle reference).

Analogie

Comme un detecteur de fuite d'eau : il te montre exactement ou tu perds des performances.

Exemple de code

// wdyr.js (importer en premier)
import React from 'react';
import whyDidYouRender from '@welldone-software/why-did-you-render';
whyDidYouRender(React);

// Sur un composant specifique
MyComponent.whyDidYouRender = true;

Cas d'usage

Debugger les re-rendus excessifs pendant le developpement pour trouver les fuites de performance.

#performance#devtools#debugging