Use an offline storage engine to store data in the browser

Use an offline storage engine to store data in the browser

At the moment of writing this article 2 off-line storage engines are available to the majority of the modern browsers. These database engines are also known as Web SQL Database and Indexed Database. While both serve more and less the same purpose they are totally different in use and in their capabilities.

Web SQL is basically a SQLite implementation and thus considered to be a relational database engine. In other words, you can use SQL to query data from tables and relations between tables exist to allow you to store and query data relationally. Indexed Database on the other hand stores records based on keys and indexes similar in having key-value lists. No query language is available so you have to write your own mechanism to get access to your data. Especially when it comes down to handle more complex data structures it can become a challenge.

Unfortunately, according to the W3C specification Web SQL is officially set to a standstill due to a lack of competition. The only  ‘future proof’ alternative to store a considerate amount of off-line data is the Indexed Database which is specified here. Also, according to the browser support table on HTML5Rocks.com both engines are not fully supported by all major browsers so that gives most of the web developers a big challenge: Do I need to write a Data Access Layer to support Web SQL, Indexed Database or both?

In the upcoming weeks I will write and post more articles to guide you through the wonder-world of both Web SQL and Indexed Database so you will have all the code and background information you need to build your own off-line storage engine. If you have any questions or remarks then please let me know.

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>