Mobx: Immutable state tree a la Flux

[rodryquintero]

What do you think about using immutable states in Mobservable? What are the advantages/drawbacks?

[mweststrate]

Depends on what you want to achieve with immutability.

To avoid some confusion; there is no such thing as immutable state. State is per definition mutable, otherwise there would be no 'state' after all, but just a static set of information. So what redux like approach do is that they put all mutations into one place; the root pointer to the _current_ state tree which is swapped upon each mutation. So you could call these really coarse grained mutations

Mobservable takes exactly the opposite approach: you are allowed to do very fine grained mutations and these are observed at a very fine grained level; individual properties are observed.

So both approaches have there advantages. Surely I am biased but I think it boils to this

Immutable state tree

• Fantastic for side-effect free testing as all actions are pure
• Easy to store and rehydrate state
• Easy to track states

Mutable state tree with fine grained observers

• Doesn't require data normalization, any graph of data can be made observable
• Referential consistency and out of the box
• Can be combined with classes
• Performs better when the state tree becomes more complex and doesn't require selectors
• Actions are a lot more straight forward to write

Note that funny stuff like tracking your state using immutable, shared data structures can still be done when using mutable data structures: http://mobxjs.github.io/mobx/refguide/create-transformer.html

I'll hope that answers your question!

[rodryquintero]

Thanks for the explanation. I was interested in immutability to reduce side effects when mutating state props.

[capaj]

@mweststrate great writeup