For obviously pure components like
function DefinitelyPure({label}:{label:string}) {
return <View><Text>{label</Text></View>
}
I know I can safely make this memoized as
const DefinitelyPurefunction = React.memo(function ({label}:{label:string}) {
return <View><Text>{label</Text></View>
});
DefinitelyPurefunction.displayName = "DefinitelyPurefunction";
However, what if I have something like
function DefinitelyPure({label}:{label:string}) {
const theme = useTheme();
return <View style={{backgroundColor: theme.primary.backgroundColor}}><Text>{label</Text></View>
}
where useTheme()
can change when the user switches themes in the app. Would the memoized component know to rerender when the context changes? (I am thinking no)
I am only asking for useContext
, since that one should trigger a rerender when the context changes and it’s on the top level, and not other hooks like useState