Web Application Storage

The web site hold my reading notes in code 201.

Web Application Storage


What we really want is

HTML Storage


It’s a way for web pages to store named key/value pairs locally, within the client web browser.

From your JavaScript code, you’ll access HTML5 Storage through the localStorage object on the global window object. Before you can use it, you should detect whether the browser supports it.

function supports_html5_storage() { try { return ‘localStorage’ in window && window[‘localStorage’] !== null; } catch (e) { return false; } }

tracing

html storage

The storage event is not cancelable. From within the handle_storage callback function, there is no way to stop the change from occurring. It’s simply a way for the browser to tell you, “hey, this just happened. There’s nothing you can do about it now; I just wanted to let you know.”

HTML5 Storage in Action


if you close the browser window mid-game, you’ll lose your progress. But with HTML5 Storage, we can save the progress locally, within the browser itself. Here is a live demonstration. Make a few moves, then close the browser tab, then re-open it. If your browser supports HTML5 Storage, the demonstration page should magically remember your exact position within the game, including the number of moves you’ve made, the position of each of the pieces on the board, and even whether a particular piece is selected.

Back to homw page