Local storage and Session storage are browser storages where frontend code can save small pieces of data without sending a request to the server.
They often store interface settings, form drafts, technical flags, temporary states, and sometimes data that should not be there.
Both storages save data by key and value. The main difference is how long the data lives and where it is available.
Local storage
Local storage is best for state that should remain after closing a tab or browser.
Stored until manual cleanup, browser cleanup, or removal by application code.
Available to all tabs with the same origin: protocol, domain, and port match.
Interface settings, color scheme, language.
Session storage
Session storage is best for state that is needed only within the current tab.
Persists after page reload.
Available only in the current tab and cleared after that tab is closed.
Current form step, temporary filters, one-tab hints.
| Check | Local storage | Session storage |
|---|---|---|
| Page reload | stays | stays |
| Closing the tab | stays | clears |
| New tab of the same site | stays | clears |
| Clearing through DevTools or code | clears | clears |
Set keys and values, then save them. Then open DevTools and find the same pairs in browser storage.
-
-
Open this page in a new tab: Local storage will be available, while Session storage will be cleared.
Important: tokens, passwords, passport data, payment data, and other sensitive values should not be stored in browser storage.
Уровень повышен!
