HTML5 Local storage vs. Session storage

Question

Apart from being non persistent and scoped only to the current window, are there any benefits (performance, data access, etc) to Session Storage over Local Storage?

Answer 1

localStorage and sessionStorage both extend Storage. There is no difference between them except for the intended "non-persistence" of sessionStorage.

That is, the data stored in localStorage persists until explicitly deleted. Changes made are saved and available for all current and future visits to the site.

For sessionStorage, changes are only available per window (or tab in browsers like Chrome and Firefox). Changes made are saved and available for the current page, as well as future visits to the site on the same window. Once the window is closed, the storage is deleted.

Answer 2

• sessionStorage maintains a separate storage area for each given origin that's available for the duration of the page session (as long as the browser is open, including page reloads and restores)

• localStorage does the same thing, but persists even when the browser is closed and reopened.

I took this from https://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API

Answer 3

The only difference is that localStorage has a different expiration time, sessionStorage will only be accessible while and by the window that created it is open.
localStorage lasts until you delete it or the user deletes it.
Lets say that you wanted to save a login username and password you would want to use sessionStorageover localStorage for security reasons (ie. another person accessing their account at a later time).
But if you wanted to save a user's settings on their machine you would probably want localStorage. All in all:

localStorage - use for long term use.
sessionStorage - use when you need to store somthing that changes or somthing temporary

Answer 4

Few other points which might be helpful to understand differences between local and session storage

1. Both local storage and session storage are scoped to document origin, so

   https://mydomain.com/
   http://mydomain.com/
   https://mydomain.com:8080/

   All of the above URL's will not share the same storage. (Notice path of the web page does not affect the web storage)

2. Session storage is different even for the document with same origin policy open in different tabs, so same web page open in two different tabs cannot share the same session storage.

3. Both local and session storage are also scoped by browser vendors. So storage data saved by IE cannot be read by Chrome or FF.

Hope this helps.

Answer 5

The main difference between localStorage and sessionStorage is that sessionStorage is unique per tab. If you close the tab the sessionStorage gets deleted, localStorage does not. Also you cannot communicate between tabs :)

Another subtle difference is that for example on Safari (8.0.3) localStorage has a limit of 2551 k characters but sessionStorage has unlimited storage

On Chrome (v43) both localStorage and sessionStorage are limited to 5101 k characters (no difference between normal / private mode)

On Firefox both localStorage and sessionStorage are limited to 5120 k characters (no difference between normal / incognito mode)

No difference in speed whatsoever :)

There's also a problem with Mobile Safari and Mobile Chrome, Private Mode Safari & Chrome have a maximum space of 0KB

Answer 6

Local storage can store upto 10mb offline data( in chrome 10 mb, in other browsers 5 mb), whereas session storage can store upto 5 mb data. But cookies can store only 4kb text data. See More Details Here