The store2 npm package is a simple, lightweight JavaScript library for cross-browser local storage with a simple but powerful API. It provides an easy way to store, retrieve, and manage data in the browser's local storage and session storage, with additional features such as namespacing and cross-tab communication.
Basic storage operations
Perform basic local storage operations such as setting, getting, removing, and clearing all items.
{"set": "store.set('user', {name: 'Marcus'})", "get": "store.get('user')", "remove": "store.remove('user')", "clearAll": "store.clearAll()"}Namespacing
Create a namespace to group related data and perform operations within that namespace.
{"createNamespace": "var userStore = store.namespace('user')", "namespaceSet": "userStore.set('info', {name: 'Marcus'})", "namespaceGet": "userStore.get('info')"}Cross-tab communication
Enable cross-tab communication by setting a flag that will trigger the storage event listener when data is changed.
{"setListen": "store.set('user', {name: 'Marcus'}, true)", "onStorage": "window.addEventListener('storage', function(e) { console.log('storage changed', e.key); })"}Additional storage methods
Use additional methods to retrieve all stored items, iterate over them, or perform a transactional operation on a stored object.
{"getAll": "store.getAll()", "each": "store.each(function(value, key) { console.log(key, '==', value); })", "transact": "store.transact('user', function(user) { user.visits = (user.visits || 0) + 1; })"}js-cookie is a simple, lightweight JavaScript API for handling browser cookies. It allows you to create, read, and delete cookies with ease. While store2 focuses on local and session storage, js-cookie is specifically designed for cookie storage, which can be useful for storing data that needs to be sent to the server on each request.
redux-persist is a library allowing to save a Redux store state in a persistent storage and rehydrate it on app start. It is more specialized than store2 as it is designed to work with Redux applications, providing a seamless way to persist and rehydrate the Redux state tree.
A feature-filled and friendly way to take advantage of localStorage and sessionStorage (JSON, namespacing, extensions, etc).
Download: store2.min.js or store2.js
NPM: npm install store2
Bower: bower install store2
NuGet: Install-Package store2
The main store function can handle set, get, transact, setAll, getAll and clear
actions directly. Respectively, these are called like so:
store(key, data); // sets stringified data under key
store(key); // gets and parses data stored under key
store(key, fn[, alt]); // run transaction function on/with data stored under key
store({key: data, key2: data2}); // sets all key/data pairs in the object
store(); // gets all stored key/data pairs as an object
store(false); // clears all items from storage
There are also more explicit and versatile functions available:
store.set(key, data[, overwrite]); // === store(key, data);
store.setAll(data[, overwrite]); // === store({key: data, key2: data});
store.get(key[, alt]); // === store(key);
store.getAll(); // === store();
store.transact(key, fn[, alt]); // === store(key, fn[, alt]);
store.clear(); // === store(false);
store.has(key); // returns true or false
store.remove(key); // removes key and its data
store.each(callback); // called with key and data args, return false to exit early
store.keys(); // returns array of keys
store.size(); // number of keys, not length of data
store.clearAll(); // clears *ALL* areas (but still namespace sensitive)
Passing in false for the optional overwrite parameters will cause set actions to be skipped
if the storage already has a value for that key. All set action methods return the previous value
for that key, by default. If overwrite is false and there is a previous value, the unused new
value will be returned.
Functions passed to transact will receive the current value for that key as an argument or
a passed alternate if there is none. When the passed function is completed, transact will save the returned value
under the specified key. If the function returns undefined, the original value will be saved.
This makes it easy for transact functions to change internal properties in a persistent way:
store.transact(key, function(obj) {
obj.changed = 'newValue';// this change will be persisted
});
All of these use the browser's localStorage (aka "local"). Using sessionStorage merely requires
calling the same functions on store.session:
store.session("addMeTo", "sessionStorage");
store.local({lots: 'of', data: 'altogether'});// store.local === store :)
All the specific get, set, etc. functions are available on both store.session and store.local, as well as any other storage facility registered via store.area(name, customStorageObject) by an extension, where customStorageObject must implement the Storage interface. This is how store.old.js extends store.js to support older versions of IE and Firefox.
If you want to put stored data from different pages or areas of your site into separate namespaces,
the store.namespace(ns) function is your friend:
var cart = store.namespace('cart');
cart('total', 23.25);// stores in localStorage as 'cart.total'
console.log(store('cart.total') == cart('total'));// logs true
console.log(store.cart.getAll());// logs {total: 23.25}
cart.session('group', 'toys');// stores in sessionStorage as 'cart.group'
The namespace provides the same exact API as store but silently adds/removes the namespace prefix as needed.
It also makes the namespaced API accessible directly via store[namespace] (e.g. store.cart) as long as it
does not conflict with an existing part of the store API.
The 'namespace' function is one of two "extra" functions that are also part of the "store API":
store.namespace(prefix[, noSession]);// returns a new store API that prefixes all key-based functions
store.isFake();// is this storage persistent? (e.g. is this old IE?)
If localStorage or sessionStorage are unavailable, they will be faked to prevent errors, but data stored will NOT persist beyond the life of the current document/page. Use the store.old.js extension to add persistent backing for the store API in ancient browsers.
These mostly could use further documentation and abuse...er...testing. Contributions are welcome! In particular, any ES6 user interested in making these importable in ES6 would be appreciated.
set() callsstore.push(key, v1, v2)).store.foo == store.get('foo'))store.get('key.property'))clear() in fake storage (thx to Martin Kluska)index.d.ts in root to provide TypeScript support (thx to Anton Strömkvist)When i went to publish this on NPM i discovered another store.js by Marcus Westin. To my surprise, even our APIs had notable overlap. His has fewer features and includes superior support for IE 6/7 in the main lib. I contacted him with the idea of merging the featuresets, but we agreed it wouldn't work. He saw his library as a temporary polyfill meant to fade away with IE 6/7. This project is meant to always be useful, as a better way to use localStorage, with polyfilling as an extension. I do hope to incorporate IE 6/7 improvements from the other store.js into store.old.js at some point, but it is not a priority.
To minimize confusion, i will be publishing the library as 'store2',
but the main function will always be store.
My apologies for the confusion caused while i was publishing this as another 'store'.
FAQs
Better localStorage
The npm package store2 receives a total of 0 weekly downloads. As such, store2 popularity was classified as not popular.
We found that store2 demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket researchers have discovered multiple malicious npm packages targeting Solana private keys, abusing Gmail to exfiltrate the data and drain Solana wallets.
Security News
PEP 770 proposes adding SBOM support to Python packages to improve transparency and catch hidden non-Python dependencies that security tools often miss.
Security News
Socket CEO Feross Aboukhadijeh discusses open source security challenges, including zero-day attacks and supply chain risks, on the Cyber Security Council podcast.