There are two types of storage
Local storage let’s you save up to 5mb of data. That data can be accessed by any other page on the same site. That data lasts between visits and even after the browser is closed
Local storage items persist even when you restart the browser whereas session storage items are cleared when you quit the browser. With session storage, the data disappears when the browser window is closed.
Things you should NOT save with local storage include unencrypted passwords, SSNs, birth dates or credit card numbers.
You can NOT store binary data like JPEG or a movie with local storage. It only stores key:value pairs, like JS Objects. Unlike JS Objects, the value of a local storage property is always a string.
The browser loads local storage data synchronously. This means the browser can not do anything else while the data loads.
Check for local storage support before using it.
1const checkLocalStorage = () => {
2 try {
3 return 'localStorage in window && window['localStorage] !== null
4 } catch (e) {
5 return false
6 }
7}
8
9if ( checkLocalStorage() ) {
10 // code goes here
11}
There are 3 functions that let you set, retrieve and remove data for a specific domain and storage type (session or local.)
.setItem(prop, value).getItem(prop).removeItem(prop)Local storage properties can be dealt with like any other JS object
localStorage.setItem('color', 'green') is the same as localStorage.color = 'green'localStorage.getItem('color') is the same as localStorage.colorlocalStorage.removeItem('color') is the same as delete localStorage.color