Differences between sessionstorage, localstorage and cookies

Differences between sessionstorage, localstorage and cookies?

LocalStorage as it's called it's local storage for your browsers, it can save up to 10MB, SessionStorage does the same, but as it's name saying, it's session based and will be deleted after closing your browser, also can save less than LocalStorage, like up to 5MB, but Cookies are very tiny data storing in your browser, that can save up 4KB and can be accessed through server or browser both...

localStorage, sessionStorage, and cookies are all client storage solutions. Session data is stored on the server, where it remains under your direct control.
localStorage and sessionStorage are relatively new APIs (this means that not all legacy browsers will support them) and are almost identical (both in the API and in the features) with the exception of perseverance. sessionStorage (as the name implies) is available only during the browser session (and is deleted when the tab or window is closed) - however, it saves page overloads (the original DOM Storage storage is the Mozilla Developer Network).

Obviously, if the data you save should be permanently available, then localStorage is preferable to sessionStorage — although you should note that both users can be cleaned by the user, so you should not rely on the constant existence of data anyway.

localStorage and sessionStorage are ideal for storing insensitive data needed in client-side scripts between pages (for example, preferences, scores in games). The data stored in localStorage and sessionStorage can be easily read or modified from within the client/browser, so do not rely on storing sensitive or security-related data in applications.

Cookies can have a degree of protection against security threats such as Cross-Site Scripting (XSS) / Script injection, setting the flag to HTTP only, which means that modern (supporting) browsers will prevent access to cookies and values ​​from JavaScript (this also will prevent access to your own, legal, javascript). This is especially important for authentication cookies that are used to store a token containing information about a user who is logged in — if you have a copy of this cookie, then for all purposes and tasks you become this user, because the web application and have the same access to the data and functions that the user has.

Since cookies are used for the purpose of authenticating and storing user data, all cookies valid for the page are sent from the browser to the server for each request in the same domain — this includes the original page request, any subsequent Ajax requests, all images, styles scripts and fonts. For this reason, cookies should not be used to store large amounts of information. The browser can also set limits on the amount of information that can be stored in cookies. Cookies are typically used to store identification tokens for authentication, session, and ad tracking.

Local storage is useful for storing data that the user will need to access later, such as offline data. Session storage is a great way to improve the performance of your web applications. Cookies are a good choice for storing data that should not be persisted for a long time, such as session IDs.