DEV Community

Discussion on: Context API preventing rerenders?

Collapse
 
bronxsystem profile image
bronxsystem • Edited

omg I love you. thank you so much. one question if ok.

I noticed in the example you did not pass the value as object, if i pass as object will it cause issue with useMemo? for example

    value={{
        output: state.output,
      }}
    >


`

Collapse
 
saisandeepvaddi profile image
Sai Sandeep Vaddi

I did pass the object. memoizedValue is an object.

const memoizedValue = React.useMemo(() => ({output}), [output]);

is same as

const memoizedValue = React.useMemo(() => { 
  return { output };
}, [output]);

So this will look like const memoizedValue = { output } which is an object.


It's better whatever object you pass in ContextProvider's value is memoized.

value={{
        output: state.output,
}}

is not receiving memoized value. Because the object {output: state.output} is not a memoized object. So even if state.output is unchanged, the {output: state.output} will not be the same as the previous value if the component that uses MyContext.Provider is re-rendered.

Thread Thread
 
bronxsystem profile image
bronxsystem

thank you very much this helps a lot