By using useMemo
/ useCallback
hook in React, sometimes I find many unexpected render causing by useMemo
/ useCallback
return value.
As I use React.memo
to reduce React function component useless render, by React.memo
second param, I could control over the comparison. Also, I can get which prop cause current render. Like after:
const MemoComponent = React.memo((props) => {}, (prevProps, nextProps) => {
for (const key in prevProps) {
const prevValue = prevProps[key];
const nextValue = nextProps[key];
if (prevValue !== nextValue) {
return false; // form here I can get which cause render
}
}
return true;
})
May I get which dependence cause useCallback
/ useMemo
recalculate like before or React devtools?