Discussion on: Difficulties Encountered with React Hooks

For the most part I think hooks are great, and often make code reusability very simple, without the need to manually reimplement things into classes, or make tons of wrapper components.

The issue I have generally isn't with hooks itself, but the docs. They could often do with better and more in-depth explanations as to how they work. Some examples:

• Why is it implied, even by the eslint rules, that all used variables must be included in the dependencies array? While it is sometimes necessary, it isn't always, as useEffect acts more like an 'onChange' listener, reacting when one of its dependencies are updated. The rest of the variables used inside it are still up-to-date when the function is run, but you may not want to trigger the effect every time one of the minor ones change.
• Multiple usages of useState are updated individually, even if their setters are called consecutively. This can easily cause a lot of unexpected state inconsistencies. Ideally it'd be nice if these updates were batched, like with classic components, but at the very least, this should be made clearer to new users.
• The importance/unimportance of memoizing functions with useCallback. I've seen arguments elsewhere online for not using it because it's 'slower'. However, whether it's slower or not often isn't the real issue - it's that the function must retain the same reference. When the reference changes, this causes its dependents to update; and that doesn't just mean re-renders, but can also mean re-invocations of things like useEffect which include it as a dependency.