search

robinvdvleuten / vuex-persistedstate

💾 Persist and rehydrate your Vuex state between page reloads.
https://npm.im/vuex-persistedstate
MIT License
5.76k stars 378 forks source link

Is it possible to use with Streamsaver.js to avoid size limits of localstorage? #376

Open vesper8 opened 3 years ago

vesper8 commented 3 years ago

I've run into issues where I am trying to save very large amounts of data with vuex-orm and I'm hitting the localstorage limit

I was wondering if it would be possible to use with https://github.com/jimmywarting/StreamSaver.js to get around this limit?

robinvdvleuten commented 3 years ago

I've built very large SPAs for a couple of professional years now and never run into the need of a full-blown ORM. Please really think your client-side architecture through before reaching to such libraries. If you run into errors like your localstorage limits, it's a good sign that something else needs some restructuring.

Maybe my comment can sound a bit harsh, I would like to help you solve this issue another way!

vesper8 commented 3 years ago

Thanks for the input @robinvdvleuten

I think my use case justifies wanting to store huge amounts of data on the client however. You see I'm building a hybrid app with Vue, Vuex, Vuex-ORM and Cordova and I'm deploying the finished app to the Android/IOS store. It's a Chess App and my datasets contain tens of thousand of records.. it's not excessively large but it's large enough that I run into the localstorage limit. And while the whole thing works fine when using APIs, I would like the whole thing to be usable completely offline. So the idea is you would download the large datasets once, or once in a while, and then it would be filled into the Vuex ORM and cached offline using vuex-persistedstate

I have all of this already working.. but I've hit the point where I have hit the local storage limit and have to limit how much data I want to cache. And I would love to be able to go beyond that limit

robinvdvleuten commented 3 years ago

Ha ok I see. If offline storage is important, I would consider using something like PouchDB (https://pouchdb.com/). Because it uses IndexedDB instead of LocalStorage, you aren't bound to the max storage limit of 5mb (https://pouchdb.com/faq.html#data_limits). It seems that when using it within a native app there isn't any limit at all. Maybe you can replace my plugin with https://github.com/MDSLKTR/pouch-vue?

vesper8 commented 3 years ago

Thanks for the tip! I'll look into that. Ive been using your plugin for years though and would have preferred to be able to just keep using. So you don't think it would be possible to just create a custom driver for Streamsaver so I could keep using everything the way it is but just have a drop-in replacement for localstorage via a custom driver? Similar to how you can use cookies instead of the default local storage I mean?