Недавно я столкнулся со случаем, когда какой-то обработчик событий на странице неправильно отписался из-за кучи ошибок. В ответ на мою предыдущую статью https://medium.com/@liunate/1-second-refactoring-readability-and-maintainability-by-naming-your-function-e-g-react-useeffect-77c7a92d37aa я обнаружил, что это также полезно назвать вашу функцию обратного вызова деструктора/отписки, возвращаемую вашим обратным вызовом useEffect.
Например:
useEffect(function listenToKeyStroke() { const logger = console.log('key down'); document.addEventListener('keydown', logger); // named destructor, which is printed out at console callstack return function stopListeningToKeyStroke() { throw 'bad code here'; document.removeEventListener('keydown', logger); }; }, [])
В дополнение к удобочитаемости исходного кода (вы знаете, для чего нужен этот деструктор), при размонтировании компонента выводит консоль, сообщающую вам, откуда возникла ошибка, без необходимости погружаться в источник: