- Small. 180 bytes (minified and gzipped). No dependencies. It uses Size Limit to control size.
- Fast. It tracks what parts of the state were changed and re-renders components only based on the changes.
- Hooks. The same Redux reducers.
- Modular. API created to move business logic away from React components.
Read more about Storeon features:
import { createStoreon } from 'storeon'
// Initial state, reducers and business logic are packed in independent modules
let count = store => {
// Initial state
store.on('@init', () => ({ count: 0 }))
// Reducers returns only changed part of the state
store.on('inc', ({ count }) => ({ count: count + 1 }))
}
export const store = createStoreon([count])
import { useStoreon } from 'storeon/react' // or storeon/preact
export const Counter = () => {
// Counter will be re-render only on `state.count` changes
const { dispatch, count } = useStoreon('count')
return <button onClick={() => dispatch('inc')}>{count}</button>
}
import { StoreContext } from 'storeon/react'
render(
<StoreContext.Provider value={store}>
<Counter />
</StoreContext.Provider>,
document.body
)