Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

With React 16.8, React Hooks are available in a stable release

reactjs.org

Post reply on HN
Print view View original

141–150 of 181 posts

Re: With React 16.8, React Hooks are available in a stable release

#141

Post by jakelazaroff »

linkmotif wrote: post #104

One thing I can’t figure out in hooks vs recompose is how to use them and avoid props drilling or even just basic wiring. One of the most glorious things about recompose is that the props are drilled/wired for you automatically. This turns out to be huge for me. I had so much tedious props drilling code that just went away with recompose. Anyone have any insight?

Use the Context API introduced in 16.3: https://reactjs.org/docs/context.html

This is the same API that or anything that "teleports" state around your tree uses internally.

Re: With React 16.8, React Hooks are available in a stable release

#142

Post by rimunroe »

baddox wrote: post #133
prophetjohn wrote: post #115

Earlier quoted context omitted.

Do you find it concerning that many software engineers with extensive professional React experience have such a difficult time understanding hooks?

I would question the premise. I consider myself fairly plugged into the professional React community on Twitter, and I have several years of React experience myself, and my impression has not been that experienced React programmers have a difficult time understanding hooks.

Same. Most of the devs I know personally were immediately convinced and loved the API. I assume the usual feedback bias is at play here.

Folks who are into hooks probably talked to friends/coworkers excitedly about them, but have a lot less reason to broadcast their feelings about it than people who had complaints. I don't think any of the people I know who were into them did anything more than than thumbsup the RFC or like/retweet some tweets--if they even did anything public at all--even though we all followed the discussions. Personally I didn't want to add to the noise with a comment which would basically be "Yeah this looks fantastic, and all these alternative APIs being suggested seem clearly worse."

People who don't like hooks spent a lot of time writing about their issues with them and what they'd like to hear instead. I wish I could get that type of feedback on everything I wrote, I just wouldn't want to deal with that immense volume.

Re: With React 16.8, React Hooks are available in a stable release

#143

Post by averge »

azangru wrote: post #129
averge wrote: post #127

Earlier quoted context omitted.

Not a fan of that non-JS svelte magic or the direction these frameworks are going. Fewer lines of code, true, but at the expense of understandability. I just want to get my work done, not learn yet another flavor of the day with non-intuitive implicit behaviors.

> I just want to get my work done I am generally with you, but the purpose of these frameworks _is_, first and foremost, to get work done (Svelte's creator Rich Harris says that it makes it possible to write UI components very fast). I love it when the code is explicit and when the framework does not introduce any weird shenanigans (Backbone, where are you? I am missing you), but this explicitness comes at a cost of…

> it makes it possible to write UI components very fast

...until you happen to code something that doesn't follow the magical convention and everything breaks for unknown reasons. Then it becomes difficult - or impossible - to debug.

Re: With React 16.8, React Hooks are available in a stable release

#144

Post by mambodog »

have_faith wrote: post #47

I've read a lot about hooks, the reasoning all makes sense but I'm still not fully getting it at an intuitive level. Like I get that it means you can write functional versions of class based components, an example of a complex class component that has been converted to a function with hooks would be good. The counter example really leaves a lot to the imagination. The examples in https://usehooks.com/ aren't convinci…

Here is a visual example of how hooks move all the parts of a single concern into a single block of code which, in a class component, would be littered across lifecycle methods: https://twitter.com/threepointone/status/1056594421079261185

Grouping these parts this way means they can be trivially extracted as a Custom Hook[1] (analogous to a 'mixin' or 'trait' in OOP).

By extracting this concern into a Custom Hook it can easily be reused by different components, as well as composed by other Custom Hooks. This was previously possible using Higher Order Components, Render Props and the (really old) React Mixins concept, but Hooks addresses problems with each of these previous approaches.

If you want to know more about how Hooks improves over these previous approaches, see my previous comment: https://news.ycombinator.com/item?id=19074469

[1]: https://reactjs.org/docs/hooks-custom.html

Re: With React 16.8, React Hooks are available in a stable release

#145

Post by WorldMaker »

beaconstudios wrote: post #54
BilalBudhani wrote: post #44

Hooks seem to be a drastic change in how we're going to write React components in the future. I'm quite satisfied with the current way of writing components which is to me is very explicit (with no magic). With Hooks React is taking a different direction from their original motto of explicit design patterns. From the looks of it, Hooks seems like a counter-intuitive design pattern but traditionally that's how most of…

Hooks fix some of the composition headaches you get from render props, which is the current standard for composition (the heritage being HOCs -> render props -> hooks). They're basically mixins with weird syntax.

The syntax isn't even that weird? It's just function calls.

The only "weird" bit is using array destructuring for multi-return and that's been in ES/JS for some time now, and definitely shouldn't look that weird to anyone that has worked in Python, as one example (and C# now supports destructuring even).

Re: With React 16.8, React Hooks are available in a stable release

#146

Post by WorldMaker »

baddox wrote: post #134
Vinnl wrote: post #106

Earlier quoted context omitted.

There's nothing wrong with `setState`, in my opinion. However, it does do magic. Although it might feel like it immediately sets the state to be what you provide it as argument, it actually schedules a state update to be performed later when React feels like it. That's why it's best practice to provide an updated function rather than a plain object: if the new state depends on the previous one, and you read the previ…

I think the more relevant analogy between hooks and setState is that setState uses essentially the exact same technique as hooks to keep track of which component is calling it, namely, React keeps track of which component it’s rendering, and setState mutates some “global” state. A lot of people seem to think that setState stores state in the instance of the React component class, but that’s not the case (and that wou…

Which is also something beginner React users often discover the hard way when they start with class instance variables, wonder why things don't work as they expect, and then have to learn to use setState.

At least from the principle of least surprise, Hooks don't have that particular learning hump of trying to use a built-in language feature (class instance variables) and finding out the hard way that they don't work as expected.

Re: With React 16.8, React Hooks are available in a stable release

#147

Post by mambodog »

omeid2 wrote: post #21

Something that I really like about React is that it is easy to reason about the state of each component, with functions there was no state, with classes, you can see everything that touches the state there in your class. I am not sure how having various functions (hooks) that trigger state changes and so re-rendering is going to pan-out in practice. Here comes setInterval and counter packages, no I don't believe I ca…

How is this different to using a React component installed from npm? You can look inside them if you want to, but don't have to. That is the goal of abstraction.

If you want to have no abstraction and show all state in your component, just don't extract any into Custom Hooks. Then it's really not very different to a class component.

Re: With React 16.8, React Hooks are available in a stable release

#148

Post by mambodog »

geezerjay wrote: post #121
joesb wrote: post #41

Earlier quoted context omitted.

Hooks offers nothing new over HoC and FaC the same way React offered nothing new over jQuery and EmberJS.

> Hooks offers nothing new over HoC and FaC You've missed the point entirely. Hooks offer nothing new because their functionality was already implemented in React class components. They literally add no functionality to React. The docs actually state quite clearly that developers are discouraged from replacing class components with function components.

How did you extract concerns from class components and reuse them previously? Easy and hygienic extraction and composability of concerns literally is something new enabled by Hooks that was not offered by class components.

You're also misrepresenting what the docs say about replacing class components. They're saying that you don't need to replace class components just for the sake of using 'the new thing'. However if there was some concern you wanted to extract from a class component that you could not previously, you absolutely could adapt it to use hooks, and then extract and reuse that concern in another component.

Re: With React 16.8, React Hooks are available in a stable release

#149

Post by linkmotif »

jakelazaroff wrote: post #141
linkmotif wrote: post #104

One thing I can’t figure out in hooks vs recompose is how to use them and avoid props drilling or even just basic wiring. One of the most glorious things about recompose is that the props are drilled/wired for you automatically. This turns out to be huge for me. I had so much tedious props drilling code that just went away with recompose. Anyone have any insight?

Use the Context API introduced in 16.3: https://reactjs.org/docs/context.html This is the same API that or anything that "teleports" state around your tree uses internally.

Fun approach! But I don’t think that’s it? Just not the same kind of zero-effort awesomeness right? Also uses the context API for something it’s not intended for.

Re: With React 16.8, React Hooks are available in a stable release

#150

Post by sephoric »

danabramov wrote: post #68
devit wrote: post #25

Are hooks being accepted as a good design by the community? It seems to me that the lack of a parameter explicitly indicating the component and the reliance on hook ordering to match them across calls of the component function make them a bad design, but I might very well wrong and would be happy to be convinced otherwise.

While HN wasn’t convinced last time I posted this, here’s a few posts or sections that explain the static call order thing: https://overreacted.io/why-do-hooks-rely-on-call-order/ https://overreacted.io/react-as-a-ui-runtime/#static-use-ord... https://github.com/reactjs/rfcs/pull/68#issuecomment-4393148... (Persistent Call Index section) Hope this helps, happy to answer questions. We’ve been using Hooks for several m…

When I first encountered hooks about a month ago, I was absolutely confused about how the `a` in `const [a,b] = useState(...)` was just a plain JS object and not some magic proxy. It took me a good hour of researching before I understood that it was because React stores state that remembers the last time it called your component. I think a 20 second well-thought-out gif would clear this up for everyone who doesn't have an hour to devote to understanding this, and I strongly recommend considering it.
Post reply on HN