A function defined in some component, gets recreated on every render, if it's not memoized with some useCallback, that's what I've learned. Does this apply to state setters, like setState in below component?
To my knowledge, foo in below component is typically a function that gets recreated on every re-render.
import { useState } from "react";
export default function App() {
const [state, setState] = useState(true);
const foo = () => console.log("Hello Word");
return (
<div>
<button onClick={() => setState(!state)}>Change state</button>
</div>
);
}
No, the dispatch function is guaranteed to always stay the same hence why you don't need to place it in the dependency array. "React guarantees that setState function identity is stable and won’t change on re-renders." React docs