How many ways(Cookies, Local Storage & Session Storage) are there to store data in the browser

Cookies, Local Storage & Session Storage

Store data in browser

LocalStorage
Laravel
SessionStorage
cache
sveltekit
cookie
Meteor
Svelte

There are 3 ways to store data in the browser.

Often the development process required storing data in the browser. We need to implement this feature to give users the best possible user experience. The 3 ways to store data, which are...

Cookies, Local Storage & Session Storage

Let's have a look at these 3 at once

Cookies, Local Storage & Session Storage

We can access Local storage, session storage and cookies from the inspect element > Application of the chrome browser

cookies, local storage & session storage chrome

Duration:

Cookies are stored on the user's computer and have a limited lifespan, which can be set by the server.

Session storage and local storage are stored in the browser itself and are only deleted when the user clears their browser data or when the data expires.

Local storage is more permanent, as the data stored in local storage is not deleted when the browser is closed.

Size:

Cookies are limited to around 4KB of data per cookie. Session storage and local storage can store larger amounts of data, up to around** 5MB**.

Scope:

Cookies are sent back to the server with each subsequent request, so the server can use the data stored in the cookie. Session storage and local storage are only accessible by the client-side JavaScript code on the website and are not sent back to the server with each request.

Security:

Cookies can be marked as "secure," which means they will only be sent over an encrypted connection (HTTPS). Session storage and local storage are only accessible from the website that created them and is not shared with other websites.

Use cases:

Cookies are commonly used to store data that the server needs to remember, like a user's login credentials or shopping cart contents. Session storage and local storage are more commonly used to store data that is only needed on the client side, like user preferences or settings. Local storage is useful for storing data that needs to be persisted across multiple sessions, like user preferences or settings.