An effect is a closure over one render

Every render creates new functions that see that render's props and state. A timer or listener created in one render keeps reading that render's values until it is replaced, which is why a counter freezes or a filter is ignored. Debug it by asking which render a callback was created in, and what its dependency array promises about when it is recreated.

The fixes are small and specific: read the latest value through a functional update, list every value the effect reads, and keep dependencies stable.

Objects are new on every render

An object or array created in a component body is a new reference each render. Put it in an effect's dependency array and the effect re-runs every render; if the effect sets state or fetches, that is an endless loop visible in the network tab. Depend on the primitive fields the effect actually reads.