HTML 5 Storing Data on the Client without using Cookies

Cookies are not suitable for large amounts of data, because they are passed on by EVERY request to the server, making it very slow and in-effective.

HTML5 offers two new objects for storing data on the client:

• localStorage - stores data with no time limit
• sessionStorage - stores data for one session

Data is NOT passed on by every server request, but used ONLY when asked for. It is possible to store large amounts of data without affecting the website's performance.

The data is stored in different areas for different websites, and a website can only access data stored by itself.

HTML5 uses JavaScript to store and access the data.

The localStorage Object

The localStorage object stores the data with no time limit. The data will be available the next day, week, or year.

How to create and access a localStorage:

<script type="text/javascript">
if (localStorage.pagevisitcount)
  {
  localStorage.pagevisitcount =Number(localStorage.pagevisitcount) +1;
  }
else
  {
  localStorage.pagevisitcount =1;
  }
document.write("Visits "+ localStorage.pagevisitcount + " time(s).");
</script>

The sessionStorage Object

The sessionStorage object stores the data for one session. The data is deleted when the user closes the browser window.

How to create and access a sessionStorage:

<script type="text/javascript">
if (sessionStorage.pagevisitcount)
  {
  sessionStorage.pagevisitcount =Number(localStorage.pagevisitcount) +1;
  }
else
  {
  sessionStorage.pagevisitcount =1;
  }
document.write("Visits "+ sessionStorage.pagevisitcount + " time(s).");
</script>

Thanks

Shinu