I started off with hooks and started learning about class components just to clear interviews and damn it provides clarity of when, how components are gonna re-render. If you can get past the HOC hell hole and the "this.add = this.add.bind(this)". I felt it made it very clear how and in what order things run. Its definitely true when OP said if things did not get so clear with class components we would never have gotten hooks.
> I felt it made it very clear how and in what order things run.
I'm sorry, the entire community rallied around hooks PRECISELY because the life cycle methods were not clear and were very problematic.
It seems extremely strange to see such opinions.
When you see a hook you know exactly when it's going to execute and why and because of what. You don't have to layer the methods with tons of checks making sure the life cycle method has been run in the right context, it literally just works.
Hooks gained momentum because of advantages in composability and removing a lot of pain with HOCs. Brevity also helped. The obfuscation about re-renders and memoization of variables is absolutely a downside that I see junior devs really struggle with all the time — something that “just works” with class components.
Anyway, both are fine and usable haha. Just think there are arguments to be made on both sides.
Ah, the clarity of useEffect(() => { return () => { handleUnmount() } }, [])! How did they manage to live with the ugly componentWillUnmount() { handleUnmount() } for all those years?
(By the way, don't forget that [] or it does a completely different thing that you never want.)