more efficient localstorage store

routes/_utils/store.js

@@ -1,21 +1,38 @@
 import { Store } from 'svelte/store.js'
 
 const key = 'ui-store'
-
+const LS = process.browser && localStorage
 class LocalStorageStore extends Store {
+
   constructor(state) {
     super(state)
     if (process.browser) {
-      let cached = localStorage.getItem(key)
-      if (cached) {
-        this.set(JSON.parse(cached))
+      this.lastChanged = {}
+      let newState = {}
+      for (let i = 0, len = LS.length; i < len; i++) {
+        let key = LS.key(i)
+        if (key.startsWith('store_')) {
+          let item = LS.getItem(key)
+          newState[key.substring(6)] = item === 'undefined' ? undefined : JSON.parse(item)
+        }
       }
+      this.set(newState)
+      this.onchange((state, changed) => {
+        Object.keys(changed).forEach(change => {
+          if (!this._computed[change]) { // TODO: better way to ignore computed values?
+            this.lastChanged[change] = true
+          }
+        })
+      })
     }
   }
 
   save() {
     if (process.browser) {
-      localStorage.setItem(key, JSON.stringify(this._state))
+      Object.keys(this.lastChanged).forEach(key => {
+        LS.setItem(`store_${key}`, JSON.stringify(this.get(key)))
+      })
+      this.lastChanged = {}
     }
   }
 }