React Shallow Context
Pure shallow equal for update propagation in 300b.
<img src="https://img.shields.io/npm/v/react-shallow-context.svg?style=flat-square" /><img src="https://img.shields.io/codecov/c/github/thekashey/react-shallow-context.svg?style=flat-square)" /><img src="https://travis-ci.org/theKashey/react-shallow-context.svg?branch=master" />Goal
This package optimizes React.Context API, implementing calculateChangedBits, which works the same way
shouldComponentUpdate or just PureComponent works - optimizes the way React react to updatedThe problem
It is common to store something inside context Provider. Something like this
<Provider value={{key1: 1, key2: 2}} />value every time, causing all Consumers to update, and causing React to traverse all
the tree, to find those Consumers.
This package provides a way to handle the value change event, and suppress unnecessary updates.API
createPureContext(defaultValue)
Creates "pure" context, the same "pure" as in "PureComponent". This is basicallyReact.createContext(xx, pureContextCompare)pureContextCompare
shallow compares the old and the next context value. Supress update if the are the same.import {pureContextCompare} from 'react-shallow-context';
const context = React.createContext({}, pureContextCompare);
// equal to
const context = createPureContext({});
```
## updateIgnoring(keys)
The same, but ignoring selected keys. Useful then context contain some `callback` function, which could be allways the different,
but play a role, only when anther value got changed.
```js
import {updateIgnoring} from 'react-shallow-context';
const context = React.createContext({importantValue, notImportantValue}, updateIgnoring(['notImportantValue']));updateOnlyFor(keys)
The same, but with inversed logic.import {updateOnlyFor} from 'react-shallow-context';
const context = React.createContext({importantValue, notImportantValue}, updateOnlyFor(['importantValue']));Written in TypeScript
Licence
MIT
