background preloader

IndexedDB

Facebook Twitter

Deep Dive into the HTML5 IndexedDB. Over the years, the web has increasingly transformed from being a repository of content to a marketplace of full-fledged functional apps.

Deep Dive into the HTML5 IndexedDB

The suite of technologies that fall under the "HTML5" banner have, as a fundamental goal, the capabilities to build within this new breed of software. In this article, I’ll review a technology that solves an important piece of the application puzzle—managing storage and retrieval of user-specific data on the client side—called "IndexedDB.

" What is IndexedDB? An IndexedDB is basically a persistent data store in the browser—a database on the client side. Like regular relational databases, it maintains indexes over the records it stores and developers use the IndexedDB JavaScript API to locate records by key or by looking up an index. IndexedDB is also a great example of how web standards evolve. If you’re new to IndexedDB, start here: Cookbook demo on IETestDrive Developers guide on MSDN Spec on W3C Setting your development environment up Object stores 1. Issues with IndexedDB and Chrome. I've been doing some investigation into IndexedDB lately, and one of the issues I ran into was Chrome not following the spec correctly. As a blogger I have the luxury of simply not caring and writing code just for Firefox.

But I was writing an article recently and was told it would make sense to try to support Chrome. Here is what I had to do to make my article work in both browsers. Supposedly Chrome will soon support the spec so this won't matter. Till then, I hope this article is helpful for folks. Firefox 4: An early walk-through of IndexedDB. Web developers already have localStorage, which is used for client side storage of simple key-value pairs.

Firefox 4: An early walk-through of IndexedDB

This alone doesn’t address the needs of many web applications for structured storage and indexed data. Mozilla is working on a structured storage API with indexing support called IndexedDB, and we will have some test builds in the next few weeks. This can be compared to the WebDatabase API implemented by several browsers that uses a subset of the allowable language of SQLite. Mozilla has chosen to not implement WebDatabase for various reasons discussed in this post. In order to compare IndexedDB and WebDatabase, we are going to show four examples that use most parts of the asynchronous APIs of each specification. These examples are for the storage of a candy store’s sale of candy to customers, which we’ll refer to as kids.

Example 1 – Opening and Setting Up a Database WebDatabase IndexedDB Example 2 – Storing Kids in the Database Example 3 – List All Kids. IDBIndex. This article is in need of a technical review. « IDBIndex The IDBIndex interface of the IndexedDB API provides asynchronous access to an index in a database.

IDBIndex

An index is a kind of object store for looking up records in another object store, called the referenced object store. » Web SQL DB vs. IndexedDB » JavAssCrypt / JavAssCrypt. Browser based storage is one of the most interesting features presented years ago as an upcoming standard for HTML5 compliant browsers. However, to this day local database support is too fragmented among user agents to be considered as a serious technology for local deployment of larger amounts of data.

Usability of local databases is something web application developers can’t get on the same page about. Some argue storing data on a browser is unsafe, insecure, unreliable, and limited in functionality (e.g. not easy to back up data, or no easy way to maintain data while user switching browsers,etc.).

HTML5 Storage. C# websocket server. A performance comparison: WebSQL vs IndexedDB. One of my initial concerns with IndexedDB was how it would handle aggregates (counts, sums, averages etc.).

A performance comparison: WebSQL vs IndexedDB

Most of the IndexedDB tutorials/examples I found online seemed very simplistic, showing basic tasks such as putting an object into a store, getting an object out of a store, and using cursors to iterate over a set of objects; but there were no good examples of aggregating objects. Also, at that time, Chrome 17 had not yet implemented the IDBObjectStore.count() and IDBIndex.count() methods as per the W3C spec, so the only way to get a count of objects from an object store or index was through a cursor iteration. To my ‘set-based’ SQL mind, the initial reaction to this was: computing aggregate values by iterating over a set of records/rows/objects is surely going to be slow.

Sure enough, counting the 6600 episodes (which took < 10ms in WebSQL with a simple SELECT COUNT(*) FROM Episodes) took > 900ms with an IndexedDB cursor. Nearly 100 times slower. Each has it’s pros and cons. Web applications - Best way to synchronize local HTML5 DB (WebSQL Storage, SQLite) with a server (2 way sync)