Sure, but like i said in the post, it's unergonomic, and makes the component more cumbersome to use. I feel that maximum correctness isn't always the best approach, all things considered. Lots of third party libraries use a similar approach to this.
Sure, that might be convenient for someone not to worry about arguments being passed to the component. However, IMO optimization should start from top to bottom, and the person who writes the code should be aware of the callback being created in every render. And it's better to eliminate the reason for the problem, not the symptom.
The React docs have a warning about passing an arrow function as a prop: pl.reactjs.org/docs/faq-functions....
Thanks for the link. On that page, it says directly after:
Is it OK to use arrow functions in render methods?
Generally speaking, yes, it is OK, and it is often the easiest way to pass parameters to callback functions.
If you do have performance issues, by all means, optimize!
I'll also note that you can see this technique in practice on Dan Abramov's blog. In fact, I learned this technique from that post, and found it useful in a lot more cases after generalizing it. You can find another variation of it directly on the react docs. Granted, there's a warning there also recommending to use useCallback, but I made sure to mirror that same warning.
That being said, I might revise the post to list useCallback as the #1 preferred solution in light of all this. However, especially in the case of third party hooks and libraries, user ergonomics is really important, and this technique is a really nice one to know about when wanting to make a user-friendly interface.
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.
Sure, but like i said in the post, it's unergonomic, and makes the component more cumbersome to use. I feel that maximum correctness isn't always the best approach, all things considered. Lots of third party libraries use a similar approach to this.
Sure, that might be convenient for someone not to worry about arguments being passed to the component. However, IMO optimization should start from top to bottom, and the person who writes the code should be aware of the callback being created in every render. And it's better to eliminate the reason for the problem, not the symptom.
The React docs have a warning about passing an arrow function as a prop:
pl.reactjs.org/docs/faq-functions....
Thanks for the link. On that page, it says directly after:
I'll also note that you can see this technique in practice on Dan Abramov's blog. In fact, I learned this technique from that post, and found it useful in a lot more cases after generalizing it. You can find another variation of it directly on the react docs. Granted, there's a warning there also recommending to use
useCallback, but I made sure to mirror that same warning.That being said, I might revise the post to list
useCallbackas the #1 preferred solution in light of all this. However, especially in the case of third party hooks and libraries, user ergonomics is really important, and this technique is a really nice one to know about when wanting to make a user-friendly interface.