[merb]

What you now basically did is an antipattern. Because your example gets quite messy if the outer state gets updated and the component should render the new value. I mean even react itself acknowledges the problem.

https://react.dev/learn/you-might-not-need-an-effect#updatin...

It’s basically that useEffect gets overused because the state hook is such a bad api.

[SebastianKra]

It's not. Try some inputs in Figma or basically any numeric input:

- Focus an Input that only accepts numerical values

- Enter some non-numeric text

- Focus back out

My pattern is fairly common when you pay attention to it.

I'm not arguing that you should always use it; that's why I didn't replicate OP’s example. It’s just a demonstration that most cases have a solution that describes the intention more accurately than a dependency array.

The remaining cases can be solved by the workaround from react.dev or a userland alternative.

[merb]

Well what you did will often not stay as is and at least evolve into the antipattern (update the input from outside) the only alternative would be to create a new key to do that. And trust me there is a lot of useeffect Code which is not a good idea