State Management + Caching for everyone.

React v18+ since it is using the official Store API.
If you like zustand and react-query you will love this.

from anywhere in your App
Simple update
less than 3kb

This library can be used without TypeScript, but all the sample code in here is written in TypeScript. And why not? It's 2023.

npm i unglitch@latest

What unglitch is

unglitch was developed with its own vision before the author knew react-query. And that is a good thing because it allowed the mind to be uninfluenced by existing code. It was actually inspired by zustand with the goal to make it even simpler and smaller and being able to avoid side-effects in web applications using the Power of the new Store API in React v18+.

Core Principles

  • Deeply nested states are bad and can always be flattened.
  • Be small. Be fast. Be simple. Be predictable.
  • Prevent unnecessary fetches (Lock'n'Release).
  • You know your App, you know the Shape of your State
  • Your store is your cache
  • Do not blow up the memory
  • Updating (foreign) data must be easy

Why isn't unglitch caching every request?

Read the Core Principles again.
Caching unnecessary data only to throw it away later is a waste of memory.

Getting started

Fetching Data

Refreshing Data

Controlling the Fetch

⚡️ Realtime Data / getSnapshot

There is only rare / specific cases where you need realtime data. So don't make this your go-to solution.

Data inside of a React component is never a realtime snapshot. It is always a snapshot of the current rendering cycle. That's how React works.