Advanced persistence extensions for Zustand v5 - encryption, compression, migration, and cloud sync
npm install zustand-persist-plus



Advanced persistence extensions for Zustand v5 — encryption, compression, migrations, and cloud sync.
---
Building robust persistence in Zustand is hard. This plugin makes it effortless:
| Feature | Without zustand-persist-plus | With zustand-persist-plus |
|---------|------------------------------|---------------------------|
| Encryption | Manual crypto-js integration | One-line middleware |
| Compression | Custom LZ-string logic | Auto compression middleware |
| Migrations | Write your own migration engine | Built-in version control |
| Cloud Sync | Complex Supabase/Firebase setup | Drop-in sync adapters |
| TypeScript | Generic types, errors everywhere | Full strict typing |
- 🔐 Encryption — AES-GCM and XSalsa20 encryption for secure data storage
- 📦 Compression — LZ-String compression to reduce storage size by 60-80%
- 🔄 Migration — Built-in schema migration with automatic version tracking
- ☁️ Cloud Sync — Firebase & Supabase real-time sync with conflict resolution
- 📄 TypeScript — Full strict typing with zero configuration
- ⚡ Zero Runtime Overhead — Tree-shakeable, minimal bundle size
``bash`
npm install zustand-persist-plus zustand@^5.0.0or
pnpm add zustand-persist-plus zustand@^5.0.0or
yarn add zustand-persist-plus zustand@^5.0.0
`typescript
import { create } from 'zustand'
import { persist, withEncryption, withCompression } from 'zustand-persist-plus'
const useStore = create(
persist(
withEncryption('your-secret-key')(
withCompression()(
(set) => ({
count: 0,
increment: () => set((state) => ({ count: state.count + 1 }))
})
)
),
{ name: 'my-store' }
)
)
`
Protect sensitive user data with military-grade encryption:
`typescript
import { create } from 'zustand'
import { persist, withEncryption } from 'zustand-persist-plus'
interface AuthStore {
token: string | null
user: User | null
setAuth: (token: string, user: User) => void
logout: () => void
}
const useAuthStore = create
persist(
withEncryption(process.env.NEXT_PUBLIC_ENCRYPTION_KEY!, {
algorithm: 'AES-GCM',
encode: true
})(
(set) => ({
token: null,
user: null,
setAuth: (token, user) => set({ token, user }),
logout: () => set({ token: null, user: null })
})
),
{ name: 'auth-store' }
)
)
`
Store large datasets efficiently:
`typescript
import { create } from 'zustand'
import { persist, withCompression } from 'zustand-persist-plus'
interface DataStore {
documents: Document[]
setDocuments: (docs: Document[]) => void
}
const useDataStore = create
persist(
withCompression({ minSize: 1024 })(
(set) => ({
documents: [],
setDocuments: (docs) => set({ documents: docs })
})
),
{ name: 'data-store' }
)
)
`
Evolve your store schema without breaking user data:
`typescript
import { create } from 'zustand'
import { persist, withMigrations } from 'zustand-persist-plus'
interface StoreV2 {
user: { name: string; email: string }
settings: { theme: 'light' | 'dark' }
}
const migrations = {
// Migrate from v1 to v2
2: (state: any) => ({
...state,
_version: 2,
settings: {
...state.settings,
theme: state.settings.theme ?? 'light'
}
})
}
const useStore = create
persist(
(set) => ({ user: null as any, settings: { theme: 'light' as const } }),
{
name: 'app-store',
migrate: withMigrations({ version: 2, migrations })
}
)
)
`
Real-time sync across devices with Supabase:
`typescript
import { create } from 'zustand'
import { persist, withCloudSync } from 'zustand-persist-plus'
import { createSupabaseAdapter } from 'zustand-persist-plus/cloud'
const useStore = create()(
persist(
withCloudSync(
createSupabaseAdapter(supabase, 'todos', {
userId: user.id,
conflictStrategy: 'last-write-wins'
})
)(
(set) => ({
todos: [],
addTodo: (todo) => set((state) => ({ todos: [...state.todos, todo] }))
})
),
{ name: 'todos' }
)
)
`
| Function | Description |
|----------|-------------|
| withEncryption(secret, options?) | Encrypt persisted data |withCompression(options?)
| | Compress persisted data |withMigrations(config)
| | Version-based schema migrations |withCloudSync(adapter, options?)
| | Real-time cloud sync |
`typescript`
// Built-in adapters
import { createIndexedDBAdapter } from 'zustand-persist-plus'
import { createSupabaseAdapter } from 'zustand-persist-plus/cloud'
import { createFirebaseAdapter } from 'zustand-persist-plus/cloud'
`typescript``
import { encrypt, decrypt, compress, decompress } from 'zustand-persist-plus'
- Full Documentation
- Cloud Sync Guide
- Migration Examples
- API Reference
Contributions are welcome! Please read our Contributing Guide.
MIT License — see LICENSE for details.
---
Built for developers who care about user data 🔒