Why Did You Render

This tool allows you to understand when your React components get renderedor re-rendered. It tells you when avoidable renders start happening and most importantly why. To install it:

npm install @welldone-software/why-did-you-render --save

To import it:


RESETRUNFULL
import React from 'react';if (process.env.NODE_ENV !== 'production') {
  const whyDidYouRender = require('@welldone-software/why-did-you-render');
  whyDidYouRender(React);}

To use it:


RESETRUNFULL
class BigListPureComponent extends React.PureComponent {
  static whyDidYouRender = true;
  render(){
    return (      //some heavy render you want to ensure doesn't happen if it is not necessary
    )
  }}