用于在开发环境跟踪 react 组件的渲染情况

https://github.com/welldone-software/why-did-you-render#readme

安装

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

开发环境启用渲染提示

import React from "react";

if (process.env.NODE_ENV === "development") {
  const whyDidYouRender = require("@welldone-software/why-did-you-render");
  whyDidYouRender(React, {
    trackAllPureComponents: false,
  });
}

引入即可

import "./wdyr";

某些组件不需要可以关闭：

export const ProjectListScreen = () => {
    // functional component
};

ProjectListScreen.whyDidYouRender = false;