Storing Offline Data
To store information locally while we are offlineâor even online but we donât want to use AJAXâ HTML5-related technologies offer us three options:
Web Storage API
Web SQL Database API
IndexedDB API
Tip
You can check current compatibility of every HTML5-related API on http://mobilehtml5.org.
In this book we are going to use the Web Storage API because itâs
the simplest one and the most compatible API between A-grade jQuery Mobile
browsers. This is a very simple API supporting two key-value based
collections: localStorage
and sessionStorage
.
localStorage
is a collection of strings stored persistently on the device and
sessionStorage
is pretty similar but it is removed from
the system when the browser is closed.
Warning
Usually, we can store up to 5 Mb per host on local storage without any problems. However, most browsers store strings in Unicode, so one character will occupy two bytes. This means that it is safe to store 2.5 Mb of text.
The API is available as a global window
attribute, called localStorage
, with some methods available, such
as getItem
and setItem
to load and save data to/from the
collection.
The standard API can only store strings, but that means that we can store:
Arrays and objects converted to a JSON-style string
Simple values
Comma-separated values
JavaScript code (that we can evaluate later)
CSS stylesheets (that we can inject later)
HTML
Images in base64 (data URI)
Tip
Modern mobile browser support the JSON API that allows us to convert objects to JSON ...
Get jQuery Mobile: Up and Running now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.