A higher order component (HOC) that allows debouncing React component updates
for a specified set of props. The debounce function is specified as an argument
so it may be chosen by the user. e.g. lodash.debounce can be used.
npm install react-debounced-props
Basic usage:
import { debounce } from "lodash";
import withDebouncedProps from "react-debounced-props";
const MyDebouncedComponent = withDebouncedProps(
["myQuicklyUpdatedProp"], func => debounce(func, 200)
)(MyComponent);Example usage with react-apollo's graphql HOC:
import { debounce } from "lodash";
import { compose, graphql } from "react-apollo";
const MyEnhancedComp = compose(
withDebouncedProps(["regionName"], func => debounce(func, 200)),
graphql(REGIONS_QUERY),
)(MyComponent);