Jotai - Primitive and flexible state management for React

  •        1296

Jotai is pronounced "joe-tie" and means "state" in Japanese. Jotai takes a bottom-up approach to React state management with an atomic model inspired by Recoil. One can build state by combining atoms and renders are optimized based on atom dependency. This solves the extra re-render issue of React context and eliminates the need for the memoization technique.

https://github.com/pmndrs/jotai
https://jotai.org/

Tags
Implementation
License
Platform

   




Related Projects

Recoil - A state management library for React

  •    Javascript

Recoil is an experimental set of utilities for state management with React. Derived data and asynchronous queries are tamed with pure functions and efficient subscriptions. It provides several capabilities that are difficult to achieve with React alone, while being compatible with the newest features of React.

zustand - 🐻 Bear necessities for state management in React

  •    TypeScript

A small, fast and scaleable bearbones state-management solution using simplified flux principles. Has a comfy api based on hooks, isn't boilerplatey or opinionated. Don't disregard it because it's cute. It has quite the claws, lots of time was spent to deal with common pitfalls, like the dreaded zombie child problem, react concurrency, and context loss between mixed renderers. It may be the one state-manager in the React space that gets all of these right.

constate - Scalable state manager using React context

  •    TypeScript

React state management library built with scalability in mind. You can start simple with local state and scale up to global state with ease when needed. In computer science, a container is a class, a data structure, or an abstract data type (ADT) whose instances are collections of other objects. In other words, they store objects in an organized way that follows specific access rules.

ReactStateMuseum - A whirlwind tour of React state management systems by example

  •    Javascript

Every app is meant to be small, simple, and the same as each other. The only difference should be the state management decisions of each. The repeated React and ReactNative app is a Packing List, with the name based on the state technology.

Mantine - A fully featured React components library includes more than 120 customizable components and hooks

  •    Typescript

Mantine is a fully featured React components library includes more than 120 customizable components and 40+ hooks to manage state and UI management. Mantine core library includes all essential components: inputs, buttons, modals, popovers, typography elements, layout management, etc.


Valtio - Makes proxy-state simple for React and Vanilla

  •    Typescript

Valtio turns the object you pass it into a self-aware proxy. You can make changes to it in the same way you would to a normal js-object. Valtio supports React-suspense and will throw promises that you access within a components render function. This eliminates all the async back-and-forth, you can access your data directly while the parent is responsible for fallback state and error handling.

fluorine - [UNMAINTAINED] Reactive state and side effect management for React using a single stream of actions

  •    Javascript

Flexible state and side effect manager using RxJS for React. Fluorine provides you with easy, reactive state and side effect management, accumulating stores from streams of actions and side effects.

akita - 🚀 State Management Tailored-Made for JS Applications

  •    TypeScript

Whether it be Angular, React, Vue, Web Components or plain old vanilla JS, Akita can do the heavy lifting and serve as a useful tool for maintaining clean, boilerplate-free, and scalable applications. Akita is a state management pattern, built on top of RxJS, which takes the idea of multiple data stores from Flux and the immutable updates from Redux, along with the concept of streaming data, to create the Observable Data Stores model.

MobX - Simple, scalable state management.

  •    Javascript

MobX is a battle tested, simple and scalable state management library transparently applying functional reactive programming (TFRP). The Mobx design principle is very simple: Anything that can be derived from the application state, should be derived. Automatically. This includes the UI, data serialization, server communication, etc.

concent - State management that tailored for react, it is simple, predictable, progressive and efficient

  •    Javascript

⚡️ State management that tailored for react, it is simple, predictable, progressive and efficient. Concent encourages simplicity. It saves you the hassle of creating boilerplate code and gives powerful tools with a moderate learning curve, suitable for both experienced and inexperienced developers alike.

Elf - A Reactive Store with Magical Powers

  •    Typescript

Elf is a reactive immutable state management solution built on top of RxJS. It uses custom RxJS operators to query the state and pure functions to update it. It encourages simplicity. It saves you the hassle of creating boilerplate code and offers powerful tools with a moderate learning curve, suitable for experienced and inexperienced developers alike.

freactal - Clean and robust state management for React and React-like libs.

  •    Javascript

freactal is a composable state management library for React.The library grew from the idea that state should be just as flexible as your React code; the state containers you build with freactal are just components, and you can compose them however you'd like. In this way, it attempts to address the often exponential relationship between application size and complexity in growing projects.

moreartyjs - Morearty.js - centralized state management for React in pure JavaScript

  •    Javascript

Morearty.js is a thin layer on top of React (implemented as a mixin) providing better state management facilities in the manner of Om but written in pure JavaScript. Underneath, Morearty leverages immutable data structures, provided by Facebook's Immutable library, which hold the state of an application. That state is described by a single Binding object and all state transitions are performed through it. When an application component needs to delegate a part of its state to a sub-component, it can create a sub-binding which points to a nested location within the global state and is fully synchronized with the original binding. This way every component knows only what it should know and the entire state is effectively encapsulated. Morearty detects any changes automatically and triggers re-rendering. Moreover, each component gets a correctly defined shouldComponentUpdate method that compares the component's state using straightforward JavaScript strict equals operator ===. So, only the components whose state was altered are re-rendered.

redux-ui - Easy UI state management for react redux

  •    Javascript

This is powerful. Each component is reusable and can still affect UI state for parent components. Step 3: In each child component use the basic @ui() decorator; it will automatically read and write UI state to the parent component's UI key.

Redux - Predictable state container for JavaScript apps

  •    Javascript

Redux is a predictable state container for JavaScript apps. It helps you write applications that behave consistently, run in different environments (client, server, and native), and are easy to test. On top of that, it provides a great developer experience, such as live code editing combined with a time traveling debugger.

reactn - React, but with built-in global state management.

  •    TypeScript

ReactN is a extension of React that includes global state management. It treats global state as if it were built into React itself -- without the boilerplate of third party libraries. For support, reach out to us on the Reactiflux Discord channel #reactn.

statty - A tiny and unobtrusive state management library for React and Preact apps

  •    Javascript

Most of the time, I see colleagues starting React projects setting up Redux + a bunch of middlewares and store enhancers by default, regardless of the project nature.Despite Redux being awesome, it's not always needed and it may slow down the process of onboarding new developers, especially if they are new to the React ecosystem (I have often seen colleagues being stuck for hours trying to understand what was the proper way to submit a simple form).

dutier - The immutable, async and hybrid state management solution for Javascript applications.

  •    Javascript

The 2kb immutable, async and universal state management solution for Javascript applications. It evolves on the ideas of Redux.

stockroom - 🗃 Offload your store management to a worker easily.

  •    Javascript

Offload your store management to a worker. Stockroom seamlessly runs a Unistore store (and its actions) in a Web Worker, setting up optimized bidirectional sync so you can also use & subscribe to it on the main thread.






We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.