Smashing Mobile Web Development

Chapter 10: Location Storage and Search

One of the major reasons native applications tend to “feel faster” is their capability to cache large amounts of data in a phone’s memory. With native APIs, developers can store databases and caches of the largest data sets and don’t require the application to contact the server every time a person navigates to an existing page.

With Corks, you are not accessing an external server for your data, but you do use foursquare and Twitter to retrieve information regarding venues and tweets. This can be bandwidth intensive, so with Mobile Web, you can use technologies such as local storage to store the results of data in the DOM in order to use that data later.

Local storage provides web-app developers the opportunity to cache large data sets in order to make them appear rapidly through page transitions. The addition of this in HTML5 prevents having to wait long for a web page to load. Being able to load data using AJAX, coupled with the power of Local Storage, creates a rich experience for users because they can access it without connecting to the Internet.

Local storage allows you to store data only in key-pair format, so when storing the data from foursquare or Twitter, you must convert the raw JSON to a string in order to use it again.

In this chapter, you use local storage to cache the foursquare venues and Twitter results. You will also use local storage in the Settings panel to create some customized features to enhance the Corks experience. ...