Core/Packages/Cache/Installation
@sigx/cache · Stable

Installation#

Add @sigx/cache v0.10.0 and register its plugin. Your useData / useAction call sites don't change.

Install the package#

Terminal
pnpm add @sigx/cache

Its only dependencies are @sigx/runtime-core and @sigx/reactivity — the two packages any SignalX renderer already builds on (web apps get them through the sigx umbrella). It never pulls in a renderer of its own, which is what makes it portable.

Register the plugin#

Install cachePlugin() on the app before you mount. This is the one line that switches useData/useAction from core's default async engine to the caching one:

TypeScript
import { createApp } from 'sigx';
import { cachePlugin } from '@sigx/cache';
import { App } from './App';

const app = createApp(App);
app.use(cachePlugin());
app.mount('#app');

The defaults you pass here apply app-wide; every option is optional:

TypeScript
app.use(cachePlugin({
    staleTime: 30_000,   // reads are fresh for 30s before revalidating
    gcTime: 300_000,     // keep entries 5min after the last consumer leaves (the default)
}));

The cache option lights up#

Once the package is a dependency, TypeScript adds the cache option to useData and useAction — it's a module augmentation of core's open option interfaces, so it appears with no extra imports:

TSX
const user = useData('user', fetchUser, {
    cache: { staleTime: 60_000 },
});

If you see the cache option flagged as unknown, the package isn't resolving — check it's installed and that your editor has picked up the new types.

Verify#

A quick check that the plugin is wired up: a cached read should survive an unmount-and-remount within gcTime instead of refetching. The Usage guide walks through each policy with a runnable shape.

Next steps#