Правило ESLint для зависимостей объектов и массивов в крюке React useEffect

#javascript #reactjs #react-hooks #eslint

Вопрос:

В приложении, над которым я работаю, возникла проблема с использованием не запоминаемых версий ссылочных типов, таких как массивы, объекты и функции (см. Зависимости объектов и массивов в крючке React useEffect). В данный момент я просматриваю весь наш код и вручную исправляю проблемы, однако это не идеальное долгосрочное решение для предотвращения повторения разработчиками той же ошибки в будущем.

Я изучаю способы предотвращения этого в будущем, чтобы оптимизировать производительность, и хотел бы найти правило lint для обеспечения того, чтобы этого никто не делал в будущем. Однако я его не вижу.

У кого-нибудь есть какие-либо предложения о хороших способах обеспечения того, чтобы эта ошибка не была допущена, кроме как просто эффективно сообщить об этом всей команде разработчиков и помочь убедиться, что все знают об этом во время проверки кода?

Комментарии:

1. Удовлетворяет ли этот плагин ESLint от команды React вашим потребностям? npmjs.com/package/eslint-plugin-react-hooks

2. @evelynhathaway Спасибо за комментарий! К сожалению, хотя этот плагин не решает эту проблему (на самом деле мы уже используем его). Одна из причин, по которой это такая серьезная проблема, заключается в том, что технически это не нарушает ни одно из правил Крючков, это просто технически неправильно или неэффективно.

3. Итак, чтобы прояснить проблему, люди продолжают добавлять полные объекты/массивы в список зависимостей крючков, и вы хотели бы предупредить их о том, чтобы они этого не делали (автоматически, с помощью линтера), и предложить альтернативы? Правильно ли я это понимаю?

4. Да, вы, по крайней мере, понимаете это так, как я это понял 🙂 У нас такая же потребность, и нам бы хотелось, чтобы линтер предупреждал любого разработчика, добавляющего объект или массив в список зависимостей крючков.

5. @pir я действительно нашел github.com/yannickcr/eslint-plugin-react/pull/2848 что довольно близко, но для другого варианта использования. Для нашего варианта использования с крючками, описанными в этом вопросе, мы в конечном итоге установили флажок в нашем шаблоне PR, который объясняет проблему, чтобы обеспечить видимость для всех разработчиков и держать ее в поле зрения.