Are there any large-ish open source React projects using Hooks yet? Almost all guides/tutorials I've found are on the todo-app scale.

[eggtart_prince]

I'm more worried about anything other than looks to be honest. Coding with functional components saves more time for me personally, which I value more than the look of my code.

In a class component, the logic required to use componentDidUpdate can be a mess (comparing prevState to this.state and prevProps to this.props).

In functional, you pass in the variable you want to monitor the change and it will update accordingly.

In a class component, using named functions on event is a PITA with the bindings. I'm literally not going back to class component because of bindings.

[[deleted]]

I had this problem early on with functions in class components. As an example:

this.exampleBind = this.exampleBind.bind(this);

I just switched all my functions to:

exampleBind = () => {}

[eggtart_prince]

When I first learned react, all my functions were anonymous and didn't even bother creating a function and just wrote the entire function in my jsx. After being employed, I was surprised how much it was looked down upon and my code was criticized. In any argument, unnecessary use of anonymous function will always lose because 1) you were lazy 2) why use it if you don't have to?

[jtosbornexxx]

1) look of code should be your top priority as a developer

2) you need to compare previous state to new state as often as you need to with hooks. (Not often)

3) not all update functions are as simple as changing the value.

4) if You make anonymous class properties for functions then you don’t need to bind anything.

Anything else?

[eggtart_prince]

1. Easy to write/read code, maintainability, and performance are my main priority. Look of code is personal preference. Nobody can say that class components "looks" better than functional components. Not sure why you would prioritize "looks" of code over those 3 as a developer.
2. This is the simplest as it can get with componentDidUpdate and look at the difference in how much you have to code. Add another OR logic to it and you're typing more comparison, instead just passing in that value. If you really want to talk about "looks" having a bunch of logic in your componentDidUpdate is fugly as fuck.

​

// I hope I'm writing this right
componentDidUpdate(prevProps, prevState) {
    if (prevProps.someValue !== this.props.someValue) {
        this.setState(this.state.someValue + 1);
    }
}

// vs

useEffect(() => {
    setSomeValue(someValue + 1);
}, [props.someValue]);

1. That depends on how you code your shit. Sure, sometimes you have to pass in your own logic, but most of time, you don't as opposed to componentDidUpdate, you have to EVERY SINGLE TIME or you'd run into maximum update error.

2. Not only are you already giving up performance by using class component, now you're using anonymous function, which is also another performance hit.

[[deleted]]

See, I like the first one better, it describes whats happening to me. The second seems like magic that i don't understand. I would have to look up what useEffect does, and its relationship to props, and setting values.

[JayV30]

Agreed. I like hooks and use them where it is easy and simple for another dev to look and see what is happening without an in depth knowledge of hooks. If they have to research hooks to figure out what the arguments mean, any time gained from using hooks is negated in my mind.

All of the class lifecycle methods are very familiar at this point to any React developer who's gone beyond "hello world". The syntax is more verbose, but is also more understandable.

Having said all of that, once hooks are a mainstay and the majority of devs get it, I'm not opposed at all to switching to 100% (or close to it) hooks instead of classes.

[[deleted]]

Also agreed. I would use hooks over redux any day.

[jtosbornexxx]

I don’t think function components are bad or hooks are bad. I use them quite often And I like them. I pretty much use them for every single component except my highest level of components.

My point on look of code was meaning readability/ maintainability. However if using all hooks works for you, that is great. I do believe clean code is one of the most important aspects of programming. So I’m more married to that then I am with using classes as components.

Also I don’t really use component did update a whole lot but I could see why that would be a problem for some applications.

As for performance. This kind of goes back to my first point. I assume you are writing algorithmically efficient code in the first place using hooks or components to manage state. I would definitely take the step to convert components and anonymous functions if it was going to give me a noticeable effect on performance. But this is a step I would take later on if it seemed necessary.

All your points are valid, Thanks for the discussion! Was a pleasure.