Skip to content

Instantly share code, notes, and snippets.

@simonespa
Created December 11, 2024 11:40
Show Gist options
  • Select an option

  • Save simonespa/b1e5fcd44401c456a70f0a16b6166b03 to your computer and use it in GitHub Desktop.

Select an option

Save simonespa/b1e5fcd44401c456a70f0a16b6166b03 to your computer and use it in GitHub Desktop.
Recoil

Recoil

https://recoiljs.org/

Flexible shared state

Useful when two components are not under the same line of inheritance (from two separate branch) and use the same shared state and need to keep the state in synch.

Atom

Derived data and queries

Selectors allow you to calculate the state of a component from the state of other components, without having to materialise an ad-hoc state for that component.

Applying a selector in front of an atom, can apply constraints to the state, for example the aspect ratio of a picture that remains invariate.

Selectors can also be async. Not only it has to compute the derived state, but it also has to source the data from outside the app (I/O call), simply returning a promise.

App-wide state observation

Saves the state in the URL. You can share the URL and the app will load with that same saved state.

Attach metadata to atoms. Works with state snapshots.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment