Effortless Offline with OfflineRest

offlinerest.png There is growing support in browsers for offline capabilities with the HTML 5 specification for local storage, offline notifications, and offline application cache, but adapting an application to store changes locally and do synchronization when connectivity is restored remains a major challenge for developers. Dojo 1.2’s new dojox.rpc.OfflineRest module automates the local storage of data and synchronization by leveraging the Dojo Data and REST abstractions. The OfflineRest module augments the JsonRest service in Dojo such that requests are cached in local storage for offline access, and modification requests (put, post, and delete) modify the cache and are recorded for delivery to the server; immediately if online, otherwise when connectivity is restored. Furthermore, JsonRest is the core engine used by JsonRestStore. Consequently, you can simply use the standard Dojo Data API with the JsonRestStore and effortlessly add offline capability with no modifications to your data interaction code. The underlying Rest service automates the handling of caching, storing data locally, and syncing changes. In addition the new OfflineRest module has no dependency on plugins, but rather progressively utilizes offline features that are available, while still operating properly on legacy browsers without offline support.

Our demonstration of OfflineRest is a simple database of hiking trails. Here in Salt Lake City, we have a vast array of trails close to my house. However, despite their proximity to the city, most trails still lack internet access. Our “Database for the Outdoors” can be used on the trail, offline, with the ability to view, add, update, and delete trails. Currently it can run on Firefox 3, but as other browsers with HTML 5 offline capabilities are released, they should work as well. This application is simply built by interacting with the JsonRestStore module, using the standard Dojo Data API. Dojo automatically stores all data changes in local storage, and if or when connectivity becomes available, the data changes are persisted to the server using the Rest service. By building the application on top of the Dojo Data API, the OfflineRest module allows us to easily add offline capabilities. Dojo then handles synchronization and offline access to data, which is usually the complex part of adding offline capabilities to an application.

To enable offline support with OfflineRest, load the OfflineRest module prior to loading the data store:


With OfflineRest loaded, you can now add stores to the OfflineRest module for offline support. First, initialize your data store, and then call the addStore method on OfflineRest:

trailStore = new dojox.data.JsonRestStore({url:"/Trail"});

Now the trailStore will have offline support. Any data modifications that are made through the trailStore will be persisted in local storage and synchronized to the server when connectivity is available. Data modifications can be done with the standard Dojo Data API, for example:

var item = trailStore.newItem();

OfflineRest handles the synchronization of sending all data modifications to the server. However, the current version of OfflineRest does not re-query the server for any data that it has cached locally. Consequently, it may be desirable to force a download of data from the server based on data that may have changed on the server while offline. Such an action can be performed and triggered by connecting to the downloadChanges() method on OfflineRest:

dojo.connect(dojox.rpc.OfflineRest, "downloadChanges", function(){
	.. download changes or refresh the page ..

Without defining the offline caching of the resources, this application will be available offline as long as the resources in the application are still in the browser cache, but this is not guaranteed. In order to ensure that your application is always available offline, the new HTML 5 offline cache manifest can be used to ensure that all the resources will be available so your application can always load even when offline and the application hasn’t been accessed for a while. Firefox 3 has implemented support for offline resources, and has detailed instructions on how to build a manifest to ensure your resources are included. Our trails application includes a manifest to leverage this support when available:

# v1

And we reference the manifest from our HTML page:

<html manifest="http://localhost/examples/cache-manifest">

This offline demo application was built with Persevere, and this demo is included with the Persevere download if you want to try it out yourself.

With OfflineRest, synchronization is encapsulated and handled by Dojo with data modifications persisted locally or remotely as connectivity allows. For developers that utilize JsonRestStore, offline support can be a relatively easy addition to your application. OfflineRest can also utilize the offline features in current and coming browsers like Firefox 3.

Learn more about how SitePen can be your partner

SitePen is a strategic consultancy committed to achieving technical objectives, solving critical business problems and helping our customers build web applications the right way, the first time.