HTML5: Up and Running

Beyond Named Key/Value Pairs: Competing Visions

While the past is littered with hacks and workarounds (see A Brief History of Local Storage Hacks Before HTML5), the present condition of HTML5 Storage is surprisingly rosy. A new API has been standardized and implemented across all major browsers, platforms, and devices. As a web developer, that’s just not something you see every day, is it? But there is more to life than 5 MB of named key/value pairs, and the future of persistent local storage is...how shall I put it? Well, there are a number of competing visions.

One vision is an acronym that you probably know already: SQL. In 2007, Google launched Gears, an open source cross-browser plug-in that included an embedded database based on SQLite. This early prototype later influenced the creation of the Web SQL Database specification. Web SQL Database (formerly known as “WebDB”) provides a thin wrapper around a SQL database, allowing you to do things like this from JavaScript:

openDatabase('documents', '1.0', 'Local document storage', 5*1024*1024, 
function (db) {
  db.changeVersion('', '1.0', function (t) {
    t.executeSql('CREATE TABLE docids (id, name)');
  }, error);
});

As you can see, most of the action resides in the string you pass to the executeSql() method. This string can be any supported SQL statement, including SELECT, UPDATE, INSERT, and DELETE. It’s just like backend database programming, except you’re doing it from JavaScript! Oh joy!

Table 7-3 shows which browsers