storeon-inferno

Storeon Inferno

Inferno is the fast, React-like library for building high-performance user interfaces. storeon-inferno package helps to connect store with Inferno to provide a better performance and developer experience while remaining so tiny.

• Size. 377 bytes (+ Storeon itself) instead of ~10kB of inferno-redux (minified and gzipped).
• Ecosystem. Many additional tools can be combined with a store.
• Speed. It tracks what parts of state were changed and re-renders only components based on the changes.

Install

npm install -S storeon-inferno

or

yarn add storeon-inferno

How to use

Create store using storeon module:

store.js

import { createStoreon } from 'storeon'

let counter = store => {
  store.on('@init', () => ({ count: 0 }))
  store.on('inc', ({ count }) => ({ count: count + 1 }))
}

export const store = createStoreon([counter])

main.js

Provide store using StoreonProvider from storeon-inferno:

import { render } from 'inferno'
import { StoreonProvider } from 'storeon-inferno'
import { store } from './store'

render(
  <StoreonProvider store={store}>
    <App />
  </StoreonProvider>,
  document.body
)

Import connectStoreon decorator from storeon-inferno:

Counter.js

import { connectStoreon } from 'storeon-inferno'

const Counter = ({ count, dispatch }) => {
  return (
    <div>
      {count}
      <button onClick={() => dispatch('inc')}>inc</button>
    </div>
  )
}
export default connectStoreon('count', Counter)