Iniz is a state library that brings reactivity to ReactJS.
ReactJS is a view library that uses "Push" strategy to detect changes and apply to actual DOM.
For developers to "push" state through components, different patterns such as HOC, render-props, Context are introduced.
These top-down approaches all have different drawbacks such as extra re-renders and "Provider Hell".
Iniz takes a different approach by treating ReactJS "Component"" as "Effect" and variable update as "Exception" in FP.
When a ReactJS "Component" is first rendered, Iniz collects its dependencies automatically and trigger re-render when the dependencies are updated.
Iniz provides a few primitives to describe state:
To create a state, call
atom() with first argument as initial value.
If you use TypeScript, Iniz already infers the inital value as type. You can optionally pass in a type as generic.
You can then call an "Atom" as function to get it's value. To update it, simply pass the value in the function call.
atom is declared, it's value can be tracked with an
effect() accepts function as argument and executes it once immediately.
During execution, it collects all
atom's used, and triggers again whenever the
atom's are updated.
You can also combine atoms to become a
computed accepts a function as well. But unlike
effect, it returns an
atom with computed value.
To use Iniz primitives in ReactJS, simply replace
@iniz/react and replace
effect with a component.
Souce code is available on inizio/iniz