Storage Utilities
Browser-specific storage utilities.
Classes
LocalStorageCache
LocalStorage-based cache implementation that implements the CacheStore interface from @outilx/core.
typescript
class LocalStorageCache implements CacheStore {
constructor(prefix?: string)
get(key: string): Promise<any>
set(key: string, value: any): Promise<void>
clear(): void
delete(key: string): void
has(key: string): boolean
}Constructor
prefix- Key prefix for localStorage items (default:'async_cache_')
Methods
get(key)
Retrieves a value from localStorage.
typescript
const cache = new LocalStorageCache('my_app_');
const data = await cache.get('user'); // Returns parsed JSON or undefinedset(key, value)
Stores a value in localStorage as JSON.
typescript
await cache.set('user', { name: 'John', age: 30 });clear()
Removes all items with the cache prefix from localStorage.
typescript
cache.clear(); // Removes all 'my_app_*' keysdelete(key)
Removes a specific item from localStorage.
typescript
cache.delete('user');has(key)
Checks if a key exists in localStorage.
typescript
if (cache.has('user')) {
// Key exists
}Examples
Basic Usage
typescript
import { LocalStorageCache } from '@outilx/browser';
const cache = new LocalStorageCache('app_');
// Store data
await cache.set('settings', { theme: 'dark', lang: 'en' });
// Retrieve data
const settings = await cache.get('settings');
console.log(settings); // { theme: 'dark', lang: 'en' }
// Check existence
cache.has('settings'); // true
// Delete
cache.delete('settings');
cache.has('settings'); // falseWith createAsyncProcessor
typescript
import { createAsyncProcessor, LocalStorageCache } from '@outilx/browser';
function fetchUser(id: number, cb: (err: any, result: any) => void) {
fetch(`/api/users/${id}`)
.then(res => res.json())
.then(data => cb(null, data))
.catch(err => cb(err, null));
}
// Create processor with persistent cache
const getUser = createAsyncProcessor(fetchUser, {
cache: new LocalStorageCache('user_cache_'),
keyGenerator: (id) => `user_${id}`
});
// First call - fetches from API
const user = await getUser(123);
// Subsequent calls (even after page reload) - returns from localStorage
const cachedUser = await getUser(123);WARNING
LocalStorageCache stores data as JSON strings. Make sure your data is JSON-serializable.
TIP
Use MemoryCache from @outilx/core for non-persistent caching that works in any environment.