-
-
Notifications
You must be signed in to change notification settings - Fork 116
Options
- autoCommit
- asynchronous
- mixins
- shiftReferences
- clone
- cloningFunction
- cursorSingletons
- maxHistory
- typology
- validate
By default Baobab triggers events like this:
var Baobab = require('baobab');
var tree = new Baobab({
todos: []
});
tree.on('update', function () {
// Runs last, only once, mutations are batched
console.log('update');
});
tree.select('todos').push('foo');
console.log('first mutation'); // Runs 1.
tree.select('todos').push('bar');
console.log('second mutation'); // Runs 2.
When you use the mutation methods of Baobab (push, set, merge etc.) it will batch up these changes and make one single commit, which then triggers update events. By turning off autoCommit you can control exactly when Baobab should do this operation. This is useful if you have a large application and need to fine control when updates are to be emitted.
var Baobab = require('baobab');
var tree = new Baobab({
todos: []
}, {
autoCommit: false // Default: true
});
tree.on('update', function () {
// Runs first, but only once
console.log('update');
});
tree.select('todos').push('foo'); // Will not trigger event
tree.select('todos').push('bar'); // Will not trigger event
tree.commit(); // Triggers the event synchronously
console.log('Committed'); // Runs last
In combination with the default autoCommit: true
you can control if you want events to trigger synchronously on every single mutation. This has a performance hit, but makes the code more predictable.
var Baobab = require('baobab');
var tree = new Baobab({
todos: []
}, {
asynchronous: false // Default: true
});
tree.on('update', function () {
console.log('update'); // Runs 1. and 3.
});
tree.select('todos').push('foo');
console.log('first mutation'); // Runs 2.
tree.select('todos').push('bar');
console.log('second mutation'); // Runs 4.
Optional React JS mixins to merge with baobab's ones. Especially useful is adding the PureRenderMixin from React JS. The Baobab mixin will run first, so that you can access the cursors created.
var Baobab = require('baobab');
var React = require('react/addons');
var tree = new Baobab({
todos: []
}, {
mixins: [React.PureRenderMixin]
});
Tell the tree to shift references of the objects it updates so that functions performing shallow comparisons (such as the one used by the React JS PureRenderMixin), can assess that data changed.
var Baobab = require('baobab');
var React = require('react/addons');
var tree = new Baobab({
todos: []
}, {
shiftReferences: true, // Default: false
mixins: [React.PureRenderMixin]
});
When you use the get()
method on cursors, the data retrieved will be cloned. This has a performance hit, but makes sure that you are unable to mutate the data inside the tree. This is more a discipline issue really. You should not mutate state directly, but if you feel paranoid, turn on cloning.
var Baobab = require('baobab');
var tree = new Baobab({
todos: []
}, {
clone: true // Default: false
});
var data = tree.get();
data.todos.push('foo');
// Still empty, as opposed to default behavior
tree.get(); // { todos: [] }
The library's cloning method is minimalist on purpose and won't cover edgy cases. You remain free to pass your own more complex cloning function to the tree if needed.
var Baobab = require('baobab');
var mySafeDeepClone = require('./mySafeDeepClone');
var tree = new Baobab({
todos: []
}, {
cloningFunction: mySafeDeepClone
});
By default, a baobab tree stashes the created cursor so only one would be created per path. You can override this behavior by setting cursorSingletons to false.
var Baobab = require('baobab');
var tree = new Baobab({
todos: []
}, {
cursorSingletons: false // Default: true
});
var cursorA = tree.select('todos');
var cursorB = tree.select('todos');
cursorA === cursorB // false, as opposed to true with default setting
Max number of records the tree is allowed to have within its internal history.
var Baobab = require('baobab');
var tree = new Baobab({
todos: []
}, {
maxHistory: 1 // Default: 0
});
tree.on('update', function () {
tree.get(); // { todos: ['foo'] }
tree.undo();
tree.get(); // { todos: [] }
});
tree.select('todos').push('foo');
A custom typology to be used to validate the tree's data.
A typology schema ensuring the tree's data is valid.