from Hacker News

Recoil – A state management library for React

by dar8919 on 5/14/20, 4:18 PM with 85 comments

• by mariusandra on 5/14/20, 10:26 PM

  I'm someone who through sheer coincidence (the right projects at the right time) happened/lucked into developing a React state management solution (https://kea.js.org). I've probably sunk hundreds of hours into this project by now.

  5 hours before this HN post I asked for comparisons with different site management libraries on Github here: https://github.com/keajs/kea/issues/106

  React state management is indeed a mess, meaning there are so many options to choose from. Unfortunately, even for me, a library author, it's hard to evaluate all of them properly. It would take just too much time and you never know where the real problems in any framework lay before you get neck-deep in code. And then you're too far to switch to another framework anyway.

  Someone should really map out this landscape in more depth than just an awesome list. I hope the issue linked above can spark some discussion.

  In any case, I personally think Kea is a very good solution for React state management, yet obviously I'm biased. Shrug.

  And, to keep it on the topic, Recoil seems very low level and I think you need to invent a lot of things yourself to get a full app out of it. Cool to see people trying stuff though :).

  And it's from Facebook so who knows, just by proxy it might become the default "atom" and someone will build molecules out of them...

• by weeksie on 5/14/20, 6:05 PM

  I'm not seeing how this works with more complex state flows. Doesn't seem much better than useReducer.

  Frankly, for state management I still haven't found anything that beats Redux on its own without thunks or sagas or any of that bullshit. This is despite doing my level best to see if useReducer on its own would be sufficient. It's not.

  Thunks are unmaintainable. Sagas are put together with bailing twine and rely too much on generators for my taste. (The source code is smart but it's also wildly complex.) All of it is castles in the sky for no good reason. You don't need any of that anyway.

• by saranshk on 5/14/20, 8:24 PM

  Here's an awesome video from the library author explaining a bit more about Recoil from today's React Europe live stream if anyone is interested: https://www.youtube.com/watch?v=_ISAA_Jt9kI.

• by josemaenzo on 5/17/20, 8:57 AM

  I'm happy that we are moving away from the redux-like standard. I've tried the API in a dumb example and it looks clean and easy. https://codesandbox.io/s/three-buttons-example-with-recoil-q...

  Still don't like the extra naming that you have to think of for every atom/value. Or also the key: prop that you have to define for every atom. It seems redundant for me.

  And also, as a bundle-phobia guy I am. I think 22kb as extra library is ok but it could be better.

  Liking a lot Recoil as solution for the three-button problem. I still think that the patch pattern I use with dop is better. In terms of simplicity and extra KB. This is the same example https://codesandbox.io/s/react-dop-nhj0j?file=/store.js

  But I guess I say that because I'm the creator of dop. So I'm so open to critics :)

• by flowerlad on 5/14/20, 6:57 PM

  What is it about React that state management is such a such a hassle? This is not the case in other frameworks.

  Consider iOS for example. Just add fields in App and you're done: https://developer.apple.com/documentation/swift/maintaining_...

  Similarly in ASP.NET: https://docs.microsoft.com/en-us/previous-versions/aspnet/75...

  Same in JSP: https://javabeginnerstutorial.com/jsp-tutorial/state-managem...

  But in React it is such a huge issue, and there are multiple competing solutions. There must be something wrong with the design of React that is causing this.

• by cwackerfuss on 5/15/20, 1:31 AM

  Check out easy-peasy. Ive used plain ol redux, mobx, and xstate, but easy-peasy is the fricken best. It's basically a redux wrapper that combines redux, thunks, reselect, redux logger, immer, and more into a super intuitive interface. The typescript support is super good and interacting with the API feels very modern and hook-driven.

  https://github.com/ctrlplusb/easy-peasy

• by knubie on 5/14/20, 6:27 PM

  Sounds a lot like re-frame[1] (which I believe predates Redux), they even call the state "atoms."

  [1] https://github.com/Day8/re-frame

• by jwiley on 5/14/20, 6:46 PM

  It would be useful to have a more direct comparison between this and Redux (assuming its not on the website and I missed it). In what use-cases is it preferable, in which would it not be a good fit? In the comments you mention O(1) vs O(n), diving more deeply into that would be helpful as well.

• by bfrydl on 5/14/20, 7:31 PM

  Seems like compared to Redux this would make server-side rendering very challenging. Each atom is a global singleton so I'm not sure how you could render individual requests.

• by sheerun on 5/14/20, 7:28 PM

  In a year people will rediscover MobX I guess...

• by mmerickel on 5/14/20, 6:25 PM

  Is there any support for changing multiple atoms at once / batch? This is where reducers shine to me - dispatching a single action from the ui in redux that multiple reducers can listen to and use to update their state.

  Also is there any support for getting the values of atoms outside of a hook? For example from an async action that is not coupled to the render loop which also wants to know the current value.

• by rhacker on 5/14/20, 8:49 PM

  Seems to be roughly the same amount of boilerplate as useContext, so I don't fully understand the separate purpose for it?

• by bodhibyte on 5/14/20, 7:33 PM

  Can anyone shed some light on if and how this might be used together with xstate (https://xstate.js.org/) which is based on the SCXML spec?

• by ecnrvsrp on 5/14/20, 7:20 PM

  Anyone else see Svelte stores when they look at this?

• by sawyerjhood on 5/16/20, 6:37 AM

  Great work on this davidmccabe! I remember hearing about this just before I left FB and am so glad that it is open source now.

• by rsify on 5/14/20, 8:35 PM

  I wish he would have shown the heavy tree example in 11:55 without the library, seems cute and all but if you don't provide a comparison it's hard to take seriously.

• by saranshk on 5/14/20, 8:23 PM

  Conceptually, this looks very similar to observables and RxJs. Should be interesting to explore further.

• by pppm on 5/17/20, 7:14 AM

  Ffff