Just for the sake of readability. Easier to grok. Perhaps all along though classes I had were just making inefficient/incorrect use of lifecycles though.
React's lifecycles still mystify me. I can't tell where and how renders come from. If there was an easier way to trace it, it'd be nice.
I'm making use of `React.forwardRef` and `useImperativeHandle` also. It's neat because you can forward information from a inner component for "direct" access in its parent. (https://reactjs.org/docs/hooks-reference.html#useimperativeh...)
My pitfall is variables inside callbacks that used to be "live" are stale upon invocation. So if you have a complicated components where you fishline callbacks, it doesn't behave the same.
In my case, the solution was to wrap the callbacks in `useEventCallback` https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often...