top of page

Difference Between Cookies, Local Storage & Session Storage

Updated: Jun 14, 2023

When it comes to storing data on the client side or server side, various storage options are available to suit different needs. Three commonly used storage spaces are Cookies, Session Storage, and Local Storage. Each of these options has its own characteristics and capabilities. In this article, we will delve into the details of these storage options to help you understand their features and best use cases.


cookies, local storage and session storage

1. Cookies

Cookies are small data packets that are sent back to the server with subsequent requests. They can be set to expire either from the server or the client side. Cookies are primarily used for server-side reading, making them a popular choice for maintaining user sessions and remembering user preferences.


Key Features of Cookies:

  • Capacity: Cookies have a limited capacity of around 4KB.

  • Accessibility: They can be accessed from any window or page.

  • Expiration: The expiration of cookies can be manually set.

  • Storage Location: Cookies are stored both on the browser and the server.

  • Sent with Requests: Yes, cookies are sent back to the server with each request.

  • User Blockability: Users have the ability to block cookies.

  • User Editability: Users can modify the content of cookies.


2. Local Storage

Local Storage provides a larger storage space on the client's computer and follows a key-value pair format. Unlike cookies, local storage data is not automatically sent to the server with each request. It is mainly used for client-side data storage and is accessible through JavaScript and HTML5.


Key Features of Local Storage:

  • Capacity: Local Storage offers a significantly larger capacity of around 10MB.

  • Accessibility: It can be accessed from any window or page.

  • Expiration: Local Storage data does not have an expiration date and remains persistent.

  • Storage Location: Local Storage is stored only in the browser.

  • Sent with Requests: Local Storage data is not sent to the server with requests.

  • User Blockability: Users have the ability to block local storage.

  • User Editability: Users can modify the content of local storage.


3. Session Storage:

Session Storage is similar to Local Storage in terms of capacity and accessibility. However, it is designed to store data only for the current session and is cleared when the tab or window is closed. Like Local Storage, Session Storage data is not sent to the server with requests.


Key Features of Session Storage:

  • Capacity: Session Storage provides a capacity similar to Local Storage, usually around 5MB.

  • Accessibility: It is accessible only within the same tab or window.

  • Expiration: Session Storage data is cleared when the tab or window is closed.

  • Storage Location: Session Storage is stored only in the browser.

  • Sent with Requests: Session Storage data is not sent to the server with requests.

  • User Blockability: Users have the ability to block session storage.

  • User Editability: Users can modify the content of session storage.


Conclusion:

Different storage options such as Cookies, Local Storage, and Session Storage offer varying capabilities and are suitable for different purposes. Cookies are commonly used for server-side reading, while Local Storage and Session Storage are ideal for client-side data storage. Understanding the features and limitations of each storage option can help you make informed decisions when it comes to managing and storing data in web applications.

bottom of page