Forem

Cover image for Dead simple State Management with Stoxy
Matsuuu
Matsuuu

Posted on

16 2

Dead simple State Management with Stoxy

What

Stoxy is a new, modern, reactive state management system for web applications.

It's a small, dependencyless, extensible set of functions to create stateful features for you web app, and even persist them through sessions.

How

Stoxy requires no setup. After the install with

npm install @stoxy/core
Enter fullscreen mode Exit fullscreen mode

You don't need to hassle with reducers, nor any initial state objects, you can immediately start writing stateful applications.

import { write } from '@stoxy/core';

const userData = {
    userName: "Stoxy",
    shoppingCart: [
        { id: 123, name: "Flaming hot cheetos" }
    ],
    shoppingHistory: {
        latestProducts: [
            { id: 555, name: "Doritos" },
            { id: 958, name: "Pringles" }
        ]
    }
};

write("userData", userData);
Enter fullscreen mode Exit fullscreen mode

Persisting objects through sessions can be done on a per-key basis with a single command

import { persistKey } from '@stoxy/core';

persistKey('userData');
Enter fullscreen mode Exit fullscreen mode

Reading data through the promise based API is made simple too:

read('shoppingcart').then(shoppingCartItems => {
    shoppingCartItems.map(item => console.log(item));
});
Enter fullscreen mode Exit fullscreen mode

There are multiple user-tailored functions at your disposal for more specific actions too. Read more about them at the docs.

Where

Stoxy can be run anywhere, with any framework. Even with no framework at all.

Currently Stoxy ships with element mixins for Web Components and hooks for React/Preact.

Read more about Stoxy at the site: Stoxy.dev

Stoxy just reached 50 stars in Github. Join the stargazers at GitHub!

Image of Timescale

🚀 pgai Vectorizer: SQLAlchemy and LiteLLM Make Vector Search Simple

We built pgai Vectorizer to simplify embedding management for AI applications—without needing a separate database or complex infrastructure. Since launch, developers have created over 3,000 vectorizers on Timescale Cloud, with many more self-hosted.

Read more

Top comments (5)

Collapse
 
bertmeeuws profile image
Bert Meeuws •

How would this compete against easy peasy store?

Collapse
 
matsuuu profile image
Matsuuu •

First thing I can clearly see is: Size: bundlephobia.com/result?p=easy-pea...

Another is that Stoxy utilizes the IndexedDB for performance over session/localstorage.

Indexeddb is also a better way for for example offline first applications

Third would be the framework agnosticity. Easy peasy (seems at least) is for React

Collapse
 
amani_art profile image
Austine Amani •

It's okay. But valtio takes it for me. Valtio also works well in react native

github.com/pmndrs/valtio

Collapse
 
helloitsm3 profile image
Sean •

What’s the benefit over Redux? Will this be able to replace redux or is it just another state management similar to React context?

Collapse
 
matsuuu profile image
Matsuuu • • Edited

The benefit over redux is the ease of entry, and a way more simplified, more concise API.

The package is about as small as the redux core, and way smaller than redux toolkit.

Stoxy also ships with persistence in mind from the get go, so you don't need to install any extra libraries to get said functionality.

What made me create the lib was the convoluted mess of reducers and setup you needed for even the simplest of state operations, which could be one-liners, like stoxy does

Cloudinary image

Zoom pan, gen fill, restore, overlay, upscale, crop, resize...

Chain advanced transformations through a set of image and video APIs while optimizing assets by 90%.

Explore

đź‘‹ Kindness is contagious

Immerse yourself in a wealth of knowledge with this piece, supported by the inclusive DEV Community—every developer, no matter where they are in their journey, is invited to contribute to our collective wisdom.

A simple “thank you” goes a long way—express your gratitude below in the comments!

Gathering insights enriches our journey on DEV and fortifies our community ties. Did you find this article valuable? Taking a moment to thank the author can have a significant impact.

Okay