When working with React components that have async data flowing into them either via single requests e.g.
or via a WebSocket connection/subscription state created with
useReducer that is initially based on component
can become stale/incorrect as the data flows into the component and updates the
JSON.parseing data that flows in from a connection will create new objects even if the strings being parsed as the same each render. This can defeat
useMemo and cause infinite rendering loops even if your
useReducer reducer returns the same object on each call.
null from a component triggers
useEffect clean up code.
If in your action handlers you need to do more than just
dispatch, like call a parent callback to provide a controlled value update then you can still use contexts to provide
dispatch but you will just need to also passdown the parent callback/reducer required state that is provided by your parent. Overall it will result in fewer functions on