When using head management libraries, such as react-helmet, it is possible for React hydration and re-renders to cause resources to be loaded multiple times. This package logs a warning if that happens.
yarn add react-resource-monitor
Add the following hook to start monitoring resources:
import { useResourceMonitor } from 'react-resource-monitor';
useResourceMonitor();
The useResourceMonitor()
hook accepts an object with the following settings:
Option | Description | Default |
---|---|---|
initiatorTypes | An array of initiatorType to check for duplicates. |
['script', 'link', 'css'] |
ignoreQuery | Ignore any query params when checking for duplicate resources. | true |
disable | Disable the warnings (e.g. if process.env.NODE_ENV === 'production' ). |
false |
This package will not work for IE unless you polyfill PerformanceObserver
.
# Run tests
yarn run test
# Run linting checks
yarn run lint