Is it safe to call 'update' in the render function?

[Slava Akhmechet]

Would something like this be safe:

const SomeComponent = (props) => {
  if (props.foo === ...) {
    state.update(...);
  }
}

Or should I move state.update into an effect?

[Paul Myburgh]

Hi @coffeemug ,

It would be technically "safe". But it would also potentially cause a state update during render, which is generally bad practice for React. I'm not sure about the repercussions, I'm sure I've done it before and I haven't seen any major issues - but causing a re-render during a current render would definitely affect performance, even if slightly in some cases.

The best way to use Pullstate is to have your components react to the state inside the stores, not the other way around.

What are you trying to achieve? Maybe we can find a better pattern for you.

[Slava Akhmechet]

The situation is this: I render a component C that contains a bunch of references to pieces of data in state. But sometimes the referenced data has been deleted from the state object, so I have a dangling reference. If C sees this, it updates the relevant record in state to delete the dangling reference, which causes a re-render of C (which is what I want).

An obvious solution is to delete the dangling references every time a piece of data is deleted, but for a variety of reasons this is really hard, and is much easier to do incrementally when relevant components that point to deleted data are rendered.

(Not sure if that makes sense-- it's really simple, but a bit difficult to describe in text)

[Paul Myburgh]

An obvious solution is to delete the dangling references every time a piece of data is deleted, but for a variety of reasons this is really hard, and is much easier to do incrementally when relevant components that point to deleted data are rendered.

Have you looked into reactions? Maybe you could automate that stuff out using reactions somehow.

But if there is really no way you can see those internal component references in the store itself, and "react" to changes in your store's data to clean them out, then I guess you have no choice. I would need to have a more concrete example to really know if there's a better way to solve this. It still sounds a bit obscure.

If the re-rendering of the component is not a massive performance issue for you, then I would think go for it. I would keep an eye on React itself though and what they say specifically about updating state during the render cycle - because that's what its doing behind the scenes. Best practices and how it might break is all reliant on their implementation of state updates.

[Paul Myburgh]

Gonna close this as the core of the issue is outside Pullstate's scope and I think we've covered what can be done. But feel free to comment more and continue the discussion on what patterns could help avoid this!