Practice
There are memoization libraries available that can be used with function components. For example, the
import moize from 'moize'
import Component from './components/Component' // this module exports a non-memoized component
const MemoizedFoo = moize.react(Component)
const Consumer = () => {
<div>
{'I will memoize the following entry:'}
<MemoizedFoo/>
</div>
}
Update: As of React v16.6.0, we have
const MemoComponent = React.memo(function MemoComponent(props) {
/* render using props */
});
OR
export default React.memo(MyFunctionComponent);
Comments