React observing

React observing is a performance-focused library for state management in React. Using hooks and state builders, you can build a complex state management. Keeping your app really fast, this library re-render only a component that need a re-render.

Build a observable state

Copy
const Store = observe('value')

Copy
const Store = {
  prop1: observe('value'),
  prop2: observe('value'),
}

Copy
const Store = observe({
  prop1: observe('value'),
  prop2: observe('value'),
})

Copy
const Store = observe([
  observe('value'),
])

To work correctly all properties that are States must be mandatory. See more

Hooks

Use one of our hooks to listen for any value changes that happen to your observable.

useObserver

Returns a react state and set state from a observable object.

Copy
const [value, setValue] = useObserver(myObservable)

useObserverValue

Returns a react state from a observable object.

Copy
const value = useObserverValue(myObservable)

useSetObserver

Returns a react set state from a observable object.

Copy
const setValue = useSetObserver(myObservable)

Each property as state

You can have properties that are states and properties that are not states. You can do what you want.

Copy
people # State
-- id # State
-- age # State
-- name # State
-- more # State
---- middleName # State
---- lastName # State

Or

Copy
people # State
-- id # State
-- age # State
-- name # State
-- more # NOT a state
---- middleName # State
---- lastName # NOT a state

Array of states

Each state can be updated separately without interfering with the others.

Copy
peoples # State
-- [0]
---- name # State
-- [1]
---- name # State
-- [2]
---- name # State