Effector: powerful and fast 5kb state manager

Effector is a state manager for any JavaScript app (React/Vue/Node.js). It allows you to manage data in complex applications without the risk of inflating the monolithic central store.

Key features

  • framework agnostic
  • multiple stores
  • statically typed (TypeScript/Flow/Reason)
  • computed values (no need for memoization)
  • side-effect management (async actions)
  • less boilerplate by design
  • small size
  • fast speed

Simple example

Counter app using React + hooks

import React from "react";
import ReactDOM from "react-dom";
import { createStore, createEvent, createApi } from "effector";
import { useStore } from "effector-react";

const $counter = createStore(0)
const increment = createEvent();
const decrement = createEvent();

$counter.on(increment, state => state + 1)
$counter.on(decrement, state => state - 1)

function Counter () {
  const counter = useStore($counter)
  return (
    <>
      <div>{counter}</div>
      <button onClick={increment}>+</button>
      <button onClick={decrement}>-</button>
    </>
  )
};

Author:

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.