All Projects â†’ redbadger â†’ immutable-cursor

redbadger / immutable-cursor

Licence: other
👊 Immutable cursors incorporating the Immutable.js interface over a Clojure-inspired atom

Programming Languages

javascript
184084 projects - #8 most used programming language
shell
77523 projects

Projects that are alternatives of or similar to immutable-cursor

React Recollect
State management for React
Stars: ✭ 411 (+608.62%)
Mutual labels:  state-management, immutability
react-mlyn
react bindings to mlyn
Stars: ✭ 19 (-67.24%)
Mutual labels:  state-management, immutability
Pure Store
A tiny immutable store with type safety.
Stars: ✭ 133 (+129.31%)
Mutual labels:  state-management, immutability
Mobx Keystone
A MobX powered state management solution based on data trees with first class support for Typescript, support for snapshots, patches and much more
Stars: ✭ 284 (+389.66%)
Mutual labels:  state-management, immutability
Redhooks
Predictable state container for React apps written using Hooks
Stars: ✭ 149 (+156.9%)
Mutual labels:  state-management, immutability
reactive-states
Reactive state implementations (brainstorming)
Stars: ✭ 51 (-12.07%)
Mutual labels:  state-management
mst-effect
💫 Designed to be used with MobX-State-Tree to create asynchronous actions using RxJS.
Stars: ✭ 19 (-67.24%)
Mutual labels:  state-management
bloc
A predictable state management library that helps implement the BLoC design pattern
Stars: ✭ 12 (-79.31%)
Mutual labels:  state-management
screenmanager
Stackable Screen/State Management for the LÖVE framework.
Stars: ✭ 29 (-50%)
Mutual labels:  state-management
hoox
Functional react state management base on hooks
Stars: ✭ 80 (+37.93%)
Mutual labels:  state-management
NObservable
MobX like observable state management library with Blazor support
Stars: ✭ 66 (+13.79%)
Mutual labels:  state-management
gstate
A crazy state management for lazy programmers
Stars: ✭ 27 (-53.45%)
Mutual labels:  state-management
yurt
high quality mounted real (e)states
Stars: ✭ 53 (-8.62%)
Mutual labels:  state-management
ngx-mobx
Mobx decorators for Angular Applications
Stars: ✭ 14 (-75.86%)
Mutual labels:  state-management
crypto-currency
A Flutter application showing crypto currency rates.
Stars: ✭ 16 (-72.41%)
Mutual labels:  state-management
nstate
A simple but powerful react state management library with low mind burden
Stars: ✭ 11 (-81.03%)
Mutual labels:  state-management
tuxi
✨ White glove service for your async needs
Stars: ✭ 14 (-75.86%)
Mutual labels:  state-management
storken
🦩 Storken is a React State Manager. Simple as `useState`.
Stars: ✭ 22 (-62.07%)
Mutual labels:  state-management
asyncmachine
Relational State Machine with a visual inspector
Stars: ✭ 67 (+15.52%)
Mutual labels:  state-management
php-validation-dsl
A DSL for validating data in a functional fashion
Stars: ✭ 47 (-18.97%)
Mutual labels:  immutability

Immutable Cursor

Circle CI npm version

Immutable cursors incorporating the Immutable.js API interface over a Clojure-inspired atom

Rationale

In Immutable.js' cursor implementation, all applicable parts of it's native interface are exposed as first-class citizens directly on the cursor, allowing for a rich mutative API.

Each cursor however, holds it's own reference to the root state, which quickly leads to issues with the integrity of the root state when updates are made from derived cursors - i.e not included in a chained sequence with the root cursor.

Solution

A Clojure-inspired atom is placed above the cursor composition, and is the only point of mutation in the entire system. Each cursor references this atom, which ensures that an accurate state representation always flows down the system.

const data = Immutable.fromJS({a: 1, b: 2});

const cursor = Cursor.from(data, (nextValue, prevValue, keyPath) => {
  console.log('Value changed from', prevValue, 'to', nextValue, 'at', keyPath);
});

// Multiple update transactions are serialised.
cursor.set('a', 2);
// Value changed from Map { a: 1, b: 2 } to Map { a: 2, b: 2 } at [ 'a' ]
cursor.set('b', 3);
// Value changed from Map { a: 2, b: 2 } to Map { a: 2, b: 3 } at [ 'b' ]

// Whilst the cursor the itself stays immutable.
cursor.deref(); // => Map { "a": 1, "b": 2 }

This has far reaching consequences when used in component-centric view layers such as React. A typical use case would be to make several derivations of a cursor within a React component before propagating them down the sub-tree as props.

Contributing

  1. Fork the repo and create your branch from master
  2. npm install
  3. Add tests
  4. Commit the aforementioned and associated source files. NOTE There is no need to manually create the generated dist files; this, a test run and a linting pass is done automatically every time you make a commit.
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].