Добавить `console.log` ко всем` useEffect`

Question

В целях разработки я хотел бы иметь возможность регистрировать все случаи использования useEffect в моем приложении React. Есть ли простой способ расширить поведение этой функции? Я использую Webpack, на случай, если это даст нам дополнительный способ сделать это.

Кроме того, поскольку это приведет ко многим console.log s, есть ли способ отличить их, предоставив информацию идентифицируя компонент, который вызывает useEffect?

Мне бы хотелось, чтобы это поведение «визуально» проверяло (в консоли), не перезаписывается ли приложение избыточно.

Answer 1

Мне бы хотелось, чтобы это поведение «визуально» проверяло (в консоли), если приложение выполняет избыточную перерисовку.

Существует библиотека, которая делает это для вас: https://github.com/welldone-software/why-did-you-render#readme

В репо есть простой пример для настройки:

import React from 'react';

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