%% generate tags start %%
#software-engineering
%% generate tags end %%
#software-engineering/state-management
**xoid** is a framework-agnostic state management library. **X** in its name is an ode to great projects such as Redu**X**, Mob**X** and **X**state. It's the result of careful analyses of different state management tools and paradigms. It was designed to be simple and scalable.
The biggest aim of xoid is to unify global state, local component state, and finite state machines in the single API. It even has a basic support for observable streams. It might be the very first library to introduce the notion of [isomorphic component logic](https://github.com/xoidlabs/xoid#-isomorphic-component-logic) that's able to run across multiple frameworks. With **xoid**, you can move business logic out of components in a **truly** framework-agnostic manner.
While doing all these, it also cares about its package size (~1kB gzipped), and aims to keep itself approachable for newcomers. More features are explained below, and the [documentation website](https://xoid.dev/).
To install, run the following command:
```shell
npm install xoid
```
%% run start
```ts
const {LinkPreview} = customJS
return LinkPreview.getLinkPreviewFromUrl("https://github.com/xoidlabs/xoid")
```
%%
<div class="nifty-link-card-container">
<a class="nifty-link-card" href="https://github.com/xoidlabs/xoid" target="_blank">
<div class="nifty-link-card-text">
<div class="nifty-link-card-title line-clamp-2">GitHub - xoidlabs/xoid: Framework-agnostic state management library designed for simplicity and scalability ⚛</div>
<div class="nifty-link-card-description">Framework-agnostic state management library designed for simplicity and scalability ⚛ - GitHub - xoidlabs/xoid: Framework-agnostic state management library designed for simplicity and scalability ⚛</div>
<div class="nifty-link-href">
<img class="nifty-link-icon" src="https://github.com/fluidicon.png">
https://github.com/xoidlabs/xoid
</div>
</div>
<div class="nifty-link-image-container">
<div class="nifty-link-image" style="background-image: url('https://repository-images.githubusercontent.com/300859216/fdb12528-d1a7-4672-bbba-3e7491ff8250')">
</div>
</div>
</a>
</div>
%% run end %%
> [!info] I used this in my obsidian publish