React - Can't Find The Leak, Infinite State Declaration Suspected

I'm a complete beginner in React and I was pretty happy with my first app since I, maybe, have a memory leak ? My app is very laggy after entering value in the input, after click o

Solution 1:

This won't solve your problem but one thing that will use less memory is not creating an anonymous function, but replacing it with a reference in child components.

In the AddForm.js :

// pass the reference to changeKw instead of creating an anonymous function:
<TextField
    value={kw}
    onChange={changeKw} // e will be passed automatically
/>

In the App.js (parent) :

const changeKw = e => {
    console.log(e.target.value) // e gets passedsetKw(e.target.value)
}