Skip to content

Svelte store that saves and loads data from localStorage or sessionStorage

License

Notifications You must be signed in to change notification settings

furudean/svelte-persistent-store

Repository files navigation

A girl

This is a writable svelte store that saves and loads data from Window.localStorage or Window.sessionStorage. Works with Svelte Kit out of the box.

The store listens to events from the Storage interface and will sync its internal state upon changes. This makes debugging using the developer console easy, and it will update across sessions as well.

Install

npm install @furudean/svelte-persistent-store

Use

Note: By default only JSON serializable values are handled, but custom serialization and deserialization functions can be provided.

import { persistent } from "@furudean/svelte-persistent-store"

const preferences = persistent({
	start_value: {
		foo: "bar"
	},
	key: "preferences", // key to save as in Storage
	storage_type: "localStorage" // Storage object to use
})

Custom serialization functions

Since the Storage interface only supports strings, data needs to be converted to strings before saving. By default JSON.stringify and JSON.parse is used.

You can pass custom serializer and deserializer functions if you require specific behavior when loading or saving data from Storage. For example, you can handle Dates like this:

const persistent_date = persistent({
	start_value: new Date(),
	key: "my-persistent-date",
	storage_type: "localStorage",
	serialize: (date) => date.toISOString(), // transform before saving
	deserialize: (str) => new Date(str) // transform after loading
})

About

Svelte store that saves and loads data from localStorage or sessionStorage

Topics

Resources

License

Stars

Watchers

Forks

Sponsor this project