Hi Damien! Just saw your approach and applied in a new form I was making at work. Seems like the performance went down. As I'm supposing, having one unique state for all the inputs may dispatch multiple component (input) renders, since all the states are being changed every time when just one's changing. Isn't the performance better having separated hooks for each inputs? Seems like's not just about it being more readable or not.
Pardon! I can be wrong, just tested a little stuff here and saw that my whole page was being loaded. Seems like not be a problem of this technique itself but an issue of my page/project/partial. Thank you for sharing your knowledge!
Hello!
I should have explored the performance aspect of the refactoring! I didn't consider that when I wrote that article unfortunately. I would recommend having your state variables separated when using hooks. You can find more informations on the React docs right here.
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 Damien! Just saw your approach and applied in a new form I was making at work. Seems like the performance went down. As I'm supposing, having one unique state for all the inputs may dispatch multiple component (input) renders, since all the states are being changed every time when just one's changing. Isn't the performance better having separated hooks for each inputs? Seems like's not just about it being more readable or not.
It'd probably be cooler to just merge
handleInputChange
as you did but keep hooks separated.Pardon! I can be wrong, just tested a little stuff here and saw that my whole page was being loaded. Seems like not be a problem of this technique itself but an issue of my page/project/partial. Thank you for sharing your knowledge!
Hello!
I should have explored the performance aspect of the refactoring! I didn't consider that when I wrote that article unfortunately. I would recommend having your state variables separated when using hooks. You can find more informations on the React docs right here.