Hi, you are using FormContext.Provider with a non-primitive value. This causes the context to trigger a render in its users every time the provider is rendered. You should use a React.memo to prevent that.
In order to correct use a React.memo you should use your handleFormChange in a React.useCallback.
Another thing to note here is that all of your form fields will render on each change (for example when a user is typing) in a single form field.
You can check out existing React form libraries. Some of them use a context with event listeners, other use event listeners without a context to achieve this. An example: github.com/kaliberjs/forms#other-l...
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Hi, you are using
FormContext.Provider
with a non-primitivevalue
. This causes the context to trigger a render in its users every time the provider is rendered. You should use aReact.memo
to prevent that.In order to correct use a
React.memo
you should use yourhandleFormChange
in aReact.useCallback
.Another thing to note here is that all of your form fields will render on each change (for example when a user is typing) in a single form field.
You can check out existing React form libraries. Some of them use a context with event listeners, other use event listeners without a context to achieve this. An example: github.com/kaliberjs/forms#other-l...