5 ms·
This is really excellent. I have a hook that is producing updated data every second, it’s pretty annoying that this causes everything below where the hook was i
by andy_ppp 4y ago
This is really excellent. I have a hook that is producing updated data every second, it’s pretty annoying that this causes everything below where the hook was included to be re-rendered each time, even if the updated data isn’t included. I can’t help but think using redux and connecting components to a global store as far down the hierarchy as possible was much more efficient. Is there an alternative way to do this with hooks to avoid re-rendering?
One thing I’ve started doing everywhere is putting a logger.debug(“rendering WidgetX”) at the top of every component to catch anything weird as I go along, it’s been pretty helpful.
- encoderer 4y agoPush the hook down to the lower components, and use it like you would redux?
- andy_ppp 4y agoBut I need things the hook does elsewhere, as I say I’m not even using the stuff that updates in the main component… Maybe I can separate the hooks into sets the data and reads the data somehow… Might just return to redux to be honest for this bit at least…
- ummonk 4y agoYeah separating out sets and reads is one of the reasons Redux exists.
- patrickthebold 4y agoYou can use React.useMemo to prevent children from rerendering when passed the same props. I'm not 100% sure if that's what you are describing.
- aarpmcgee 4y agofrom the article: "So, to go back to our misconception: props have nothing to do with re-renders."
- ummonk 4y agoAnd nevertheless React.Memo does exactly what they said - it prevents a component from rerendering unless it’s props change. Likewise useMemo can be used for a similar function - to prevent a component from rerendering unless the dependencies to the useMemo call change.
- patrickthebold 4y agoOops meant React.memo not useMemo https://reactjs.org/docs/react-api.html#reactmemo https://reactjs.org/docs/react-api.html#reactmemo