HTML5: Up and Running

Local Storage

HTML5 Storage provides a way for websites to store information on your computer and retrieve it later. The concept is similar to cookies, but it’s designed for larger quantities of information. Cookies are limited in size, and your browser sends them back to the web server every time it requests a new page (which takes extra time and precious bandwidth). HTML5 Storage stays on your computer, and websites can access it with JavaScript after the page is loaded.

Ask Professor Markup

Q: Is local storage really part of HTML5? Why is it in a separate specification?

A: The short answer is yes, local storage is part of HTML5. The slightly longer answer is that local storage used to be part of the main HTML5 specification, but it was split out into a separate specification because some people in the HTML5 Working Group complained that HTML5 was too big. If that sounds like slicing a pie into more pieces to reduce the total number of calories...well, welcome to the wacky world of standards.

Checking for HTML5 Storage support uses detection technique #1 (see Detection Techniques). If your browser supports HTML5 Storage, there will be a localStorage property on the global window object. If your browser doesn’t support HTML5 Storage, the localStorage property will be undefined. You can check for local storage support using this function:

function supports_local_storage() {
  return ('localStorage' in window) && window['localStorage'] !== null;
}

Instead of writing this function yourself, ...