Currently I'm experimenting with localStorage to store a large amount of objects of same type, and I am getting a bit confused.
One way of thinking is to store all the object in an array. But then for each read/write of a single object I need to deserialise/serialise the whole array.
The other way is to directly store each object with its key in the localStorage. This will make accessing each object much easier but I'm worried of the amount of objects that will be stored (tens of thousands). Also, getting all the objects will require iterating the whole localStorage!
I'm wondering which way will be better in your experience? Also, would it be worthwhile to try on more sophisticated client side database like PouchDB?
In basic terms, local storage enables developers to store and retrieve data in the browser. It is critical to understand, though, that using localStorage as a database for your project is not a good practice, since data will be lost when the user clears the cache, among other things.
It is limited to about 5MB and can contain only strings. Because it is tab specific, it is not accessible from web workers or service workers. LocalStorage should be avoided because it is synchronous and will block the main thread. It is limited to about 5MB and can contain only strings.
If you do not want to have a lot of keys, you can:
\n
and store them as a single keyIn this case parsing rows is just .split('\n')
that is ~2 orders of magnitude faster, then JSON.parse
.
Please, notice, that you possibly need special effort to syncronize simultaneously opened tabs. It can be a challenge in complex cases.
localStorage has both good and bad parts.
Good parts:
JSON.stringify
is in general 5-20 times slower than localStorage.setItem
);Bad news:
These points show borders of localStorage applicability as a DB. LS is good for tasks, where you need syncronicity and speed, and where you can trim you DB to fit into quota.
So localStorage is good for caches and logs. Not more.
If you want something simple for storing a large amount of key/values, and you don't want to have to worry about the types, then I recommend LocalForage. You can store strings, numbers, arrays, objects, Blobs, whatever you want. It uses IndexedDB and WebSQL where available, so the storage limits are much higher than LocalStorage.
PouchDB works too, but the API is more complex, and it's better-suited for when you want to sync data with CouchDB on the server.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With