Affiliate link

HTML - Storage

Web applications data are commonly stored in local storage or session/cookies storage.

HTML - Types of storage

• Local Storage
• Session Storage
• IndexedDB
• Cookies

HTML - Local Storage

localStorage persists data even when the browser is closed and reopened.

• Stores data with no expiration date, and gets cleared only through JavaScript, or clearing the browser cache / local storage.

<script type="javascript">
    const storage = window.localStorage;
    const x = '__storage_test__';
    storage.setItem(x, x);
    storage.removeItem(x);
</script>

HTML - Session Storage

sessionStorage stores data for each user session. (As long as the browser is opened, and reloads/refresh)

• Stores data only for a session, meaning that the data is stored until the browser (or tab) is closed.
• Data is never transferred to the server.
• Storage limit is larger than a cookie (at most 5MB).

<script type="javascript">
    const storage = window.sessionStorage;
    const x = '__storage_test__';
    storage.setItem(x, x);
    storage.removeItem(x);
</script>

HTML - IndexedDB

indexedDB allows storing large amount of structured data, including files.

• Stores data only for a session, meaning that the data is stored until the browser (or tab) is closed.
• Data is never transferred to the server.
• Storage limit is larger than a cookie (at most 5MB).

<script type="javascript">
    const request = window.indexedDB.open("MyTestDatabase", 3); 
</script>

Affiliate link