IndexedDB Updates for IE10 and Metro style apps

The Internet Explorer team along with the broader Web community has continued to make improvements to the IndexedDB specification. IndexedDB is a W3C Working Draft that enables you to store, search, and retrieve data on the user’s device, even when Internet connectivity is disabled.  IndexedDB is a feature of the Web platform shared by IE10 and Metro style apps in the Windows 8 Consumer Preview.

This blog post describes changes we made in Internet Explorer 10 Consumer preview to implement the latest version of the W3C spec.

Changes to Versioning

The most significant change involves how developers update their database schemas (i.e. object stores, indexes) from one version to the next. The working group (including Microsoft) decided to replace the IDBDatabase.setVersion API with a new IDBFactory.open API. The new open API uses an additional parameter to detect if you want to use the current database version of the or if you want to update the database schema to a newer version. The open API now returns an IDBOpenDBRequest object which lets you register for the onupgradeneeded event. In the event handler you can update your database schema by adding additional object stores and indexes.

To update your existing code, add a version parameter to your open method, replacing the call to setVersion, and register a new onupgradeneeded event handler on the IDBOpenDBRequest (see below).

Old code example – green highlights the impacted code

function openDBTest(dbName) {

var rq = window.msIndexedDB.open(dbName);

rq.onsuccess = successOpenningDB;

rq.onerror = failureHandler;

}

 

function successOpenningDB(evt) {

var db = evt.target.result;

var rq = db.setVersion("1");

rq.onsuccess = successHandler;

rq.onerror = failureHandler;

}

 

function successHandler(evt) {

//create schema

}

New code example – yellow highlights the changed code

function openDBTest(dbName) {

var rq = window.msIndexedDB.open(dbName, 1);

rq.onsuccess = useDB;

rq.onupgradeneeded = successHandler;

rq.onerror = failureHandler;

}

 

function successHandler(evt) {

//create schema

}

Additional Changes

In addition, we made several smaller (but still significant) changes to the platform:

• Added the IDBCursor.advance(count) method. This method enables you to skip records in a cursor, which in turn enables pagination scenarios. The count parameter defines the number of records you want to skip before accessing data. Valid values are 1 or greater.
• Added the IDBObjectStore.count(key) and IDBIndex.count(key) methods. These enable you to count the records that match specific criteria. If the key value is not specified, a count of all records inside the index or the object store is returned.
• Added the IDBFactory.cmp(first, second) method. This method compares two key values to determine if one value is greater than the other or both values are equal.
• IDBKeyRanges now work with additional methods, including IDBObjectStore.count, IDBObjectStore.delete, IDBIndex.count. This allows you to match records that span groups of key values.
• Values being added to the database needed no longer need to satisfy all previously defined indexes. This allows you to add records to an IDBObjectStore that fall outside the limits of previously defined indexes.
• If an exception is thrown within the context of an active transaction, the transaction is aborted. This implies that if an exception is thrown within the onsuccess event handler of any request, the active transaction will be aborted. However, handling the exception will allow the database transaction to continue as normal.
  

  // This won’t abort the transaction because there is no active transaction.

  function createTransaction() {

  var txn = db.transaction("test");

  window.aaaaaa();

  }

   

  // This will abort the transaction because the exception is thrown when there is an active transaction.

  var rq = objectStore.add(record);

  rq.onsuccess = function (event) {

  window.aaaaaa();

  }

• Added support to index properties on a Blob. This allows you to download binary data from the Web, store it locally, and use blob properties (e.g. name, size, etc.) as indexes or unique keys into the blob. This functionality enables scenarios like offline listening of your music collection or viewing of images and videos, while having the ability to search through your collection using the blob’s name. Our latest IE Test drive demo shows you how you can use this functionality to view your Facebook albums offline.


Screen shot of IE Test Drive demo Facebook Companion

We also submitted over 100 test cases to the W3C working group for IndexedDB, including new tests and updates to existing tests.

Controlling How Sites and Apps use IndexedDB

In addition to updates to match changes in the W3C specification, the Windows 8 Consumer Preview includes improvements that allow users to remain in control of how sites and apps use IndexedDB on their devices:

• Introduced an uninstall handler for Metro style apps that use indexedDB. This handler ensures that any time end-users remove an application, the related data in the app’s IndexedDB database will be automatically deleted during the uninstall process.
• Implemented a quotas (storage limits) to prevent sites from exhausting disk space. Quota limits can be updated by IT Admins via group policy settings or by users with administrative access to the Registry. However, quotas don’t apply to Metro style apps.
• Added a new browser interface for end-users to manage their databases and manage quotas. Users can use the Caches and databases dialog to remove individual databases. Alternatively, you can remove all databases using the Delete Browsing History dialog to select the “Cookies and Web site data” checkbox.

Screen shots of the new Caches and databases tab of the Website Data Settings dialog and the updated Delete Browsing History dialog

Looking Ahead

The W3C WebApp Working Group continues to drive IndexedDB to completion by making important improvements and reducing the number and scope of changes made to the spec.  This is an important step for Web developers building on this technology in the near future, including in Windows 8 and IE10.

We look forward to seeing how you use IndexedDB in your sites and apps, and welcome your feedback on IndexedDB in IE10.

—Israel Hilerio, Ph.D., Principal Program Manager, Internet Explorer

IEBlog