Introduction
As you certainly know, HTML5 bring some very useful features for web applications, like socket connection or browser storage capabilities. In this article, I make some kind of state of the art about browser storage capabilities.
If you plan to save data on a browser, there is three possibilities : LocalStorage, SQLite and IndexedDB. You probably want to know which one to choose. There is actually no right or wrong response. First of all, I will describe every possibility with it’s advantages and disadvantages.
LocalStorage
The LocalStorage object is a simple key => value store. The key and the value are simple strings, it works like a dictionnary.
The main advantages of the LocalStorage is it’s simplicity and it’s support on lots of browsers.
The main disadvantage of the LocalStorage is it’s little storage capacity. After some little benchmarks, we can’t save up to 5MB of data.
SQLite
SQLite was, at first, designed as the de-facto browser storage standard. Now, the W3C don’t support SQLite anymore. The main reason is the incapacity for them to use a standard instead of an application. Lots of browsers where implementing a SQLite database accessible with JavaScript but the W3C wanted a standard describing the SQL language and the provided JavaScript API. There is a JavaScript API but no one were able to provide a SQL standard. Finally, the W3C don’t support the SQLite as browser storage anymore but it’s still implemented in some browsers. SQLite can save up to 1Go data on a desktop computer and up to 50MB data on a smartphone (depending on the browser configuration).
The main advantage of SQLite is it’s availability (it’s provided by mobile browsers on Android and iOS, by PhoneGap for mobile applications and by Chrome 15 and Safari 5).
The main disadvantage of SQLite is that the W3C don’t support SQLite anymore and some browsers, like Firefox, removed the SQLite support in their last versions.
IndexedDB
IndexedDB is the new standard provided by the W3C. It’s not a relationnal database but it’s a document based database. A database is composed of multiple stores, every store contain data in key => value format. The data are saved in object format. It’s possible, for the developer, to make a query on some specific properties of an object to get them back. Actually, Chrome 15 and Firefox 8 have an implementation of IndexedDB but the implementations are quite different. A script using IndexedDB on Chrome don’t work on Firefox and vice versa. The IndexedDB standard isn’t completely done and the API is still changing.
The main advantages of IndexedDB is the support of the W3C and it’s capability to save directly JavaScript objects instead of serialized objects and the capability to create request on saved objects.
The main disadvantage of IndexedDB is it’s young age : the standard is still changing and IndexedDB is only implemented in few browsers.
Conclusion
The next picture show the browser supports for LocalStorage, SQLite and IndexedDB.
Actual support of HTML5 browser storage by browser
The better solution actually is to use an intermediate layer for browser storage, supporting SQLite, LocalStorage and (in the futur) IndexedDB. In this way, developers will be able to create web application using browser storage capabilities with enough flexibility to work on every modern browser.
I’ve already developed an intermediate layer with query capabilities and I will introduce it in a next article.
