706

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?

3

11 Answers 11

1014

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 tab. Changes made are saved and available for the current page in that tab until it is closed. Once it is closed, the stored data is deleted.

4
  • 20
    there's a broader discussion that you may find helpful here: stackoverflow.com/questions/19867599/…
    – Ed Sykes
    Apr 27, 2014 at 11:51
  • 18
    if you save some data in storage under http, you will not be able to retrieve it at https
    – Mark Thien
    Jun 9, 2014 at 9:52
  • i tested this on Chrome v41.x and it seems that the above statement about https is not true: localStorage retains its stored data.
    – CCC
    Apr 10, 2015 at 19:02
  • 54
    SessionStorage survives over page reloads and restores, but opening a new tab/window will initiate a new session.
    – Patrick
    Jun 26, 2015 at 10:01
180

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

119

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.example/ 
    http://mydomain.example/
    https://mydomain.example: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.

4
  • 3
    No, same sessionStorage share between http and https but localStorage not.
    – Shahdat
    Aug 26, 2016 at 23:44
  • 8
    If you set sessionStorage in https origin first, it will be available in http but if you create sessionStore in http then will not be available in http
    – Shahdat
    Aug 26, 2016 at 23:51
  • 6
    @Shahdat, did you mean "then will not be available in https" (notice the s)? May 23, 2017 at 12:00
  • 5
    @DanielWerner yes, if you create sessionStore in http then will not be available in https.
    – Shahdat
    May 23, 2017 at 16:44
36

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 / incognito mode)

On Firefox both localStorage and sessionStorage are limited to 5120 k characters (no difference between normal / private 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

5
  • 1
    limited to 5101 k characters? so.. 5.101 million characters?
    – Zze
    Sep 27, 2017 at 2:55
  • @Zze Yes, 1 character is usually 1 byte hence 5 million characters is 5Mb worth of storage. Jan 7, 2018 at 11:23
  • @BasimKhajwal That is 5MB. Bytes, not bits.
    – Yeti
    Sep 5, 2018 at 9:25
  • Can you please add source to what you have mentioned?
    – Mukus
    Sep 19, 2018 at 5:20
  • @Mukus, there is no source, I ran tests myself, and had an issue with Private Mode Safari for having localStorage but having no space there and my polyfill wouldn't trigger since localStorage existed, but the script failed since it couldn't store anything there. You can test too using this tool - dev-test.nemikor.com/web-storage/support-test
    – Eek
    Sep 19, 2018 at 11:47
19

sessionStorage is the same as localStorage, except that it stores the data for only one session, and it will be removed when the user closes the browser window that created it.

2
9

performance wise, my (crude) measurements found no difference on 1000 writes and reads

security wise, intuitively it would seem the localStore might be shut down before the sessionStore, but have no concrete evidence - maybe someone else does?

functional wise, concur with digitalFresh above

1
  • 1
    regarding page load performance: Both, sessionStorage and localStorage are initiated and populated out of the page-load-render cycle. Therefore the toll on initial page load time is not measurable from within the browser.
    – Mirko
    Feb 2, 2015 at 21:38
9
  • 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 Web Storage API

0
6

Ya session storage and local storage are same in behaviour except one that is local storage will store the data until and unless the user delete the cache and cookies and session storage data will retain in the system until we close the session i,e until we close the session storage created window.

6

The advantage of the session storage over local storage, in my opinion, is that it has unlimited capacity in Firefox, and won't persist longer than the session. (Of course it depends on what your goal is.)

4

Late answer but felt to add some points here.

Session storage will be available for specific tab where as we can use Local storage through out the browser. Both are default to same origin and we can also store values manually with key, value pairs (value must be string).

Once tab (session) of the browser is closed then Session storage will be cleared on that tab, where as in case of Local storage we need to clear it explicitly. Maximum storage limit respectively 5MB and 10MB.

We can save and retrieve the data like below,

To Save:

sessionStorage.setItem('id', noOfClicks);   // localStorage.setItem('id', noOfClicks);

sessionStorage.setItem('userDetails', JSON.stringify(userDetails));   // if it's object

To Get:

sessionStorage.getItem('id');    // localStorage.getItem('id');

User user = JSON.parse(sessionStorage.getItem("userDetails")) as User;  // if it's object

To Modify:

sessionStorage.removeItem('id');    // localStorage.removeItem('id');

sessionStorage.clear();   // localStorage.clear();

P.S: getItem() also return back the data as string and we need convert it into JSON format to access if it's object.

You can read more about Browser Storages here..

  1. Difference between localStorage, sessionStorage and cookies

  2. localstorage-vs-sessionstorage

3

Local storage: It keeps store the user information data without expiration date this data will not be deleted when user closed the browser windows it will be available for day, week, month and year.

//Set the value in a local storage object
localStorage.setItem('name', myName);

//Get the value from storage object
localStorage.getItem('name');

//Delete the value from local storage object
localStorage.removeItem(name);//Delete specifice obeject from local storege
localStorage.clear();//Delete all from local storege

Session Storage: It is same like local storage date except it will delete all windows when browser windows closed by a web user.

//set the value to a object in session storege
sessionStorage.myNameInSession = "Krishna";

Read More Click

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.