Jeb Wilkins

Coding and climbing in Cumbria.

The Web Without a Webserver

Desktop software seems to be becoming more and more of a niche requirement when it comes to bespoke software. In comparison to web based software it tends to be slower to develop, and more time consuming to roll out updates, etc.

Recently I’d had a client come to me with a requirement to write a data capture application to work in parallel with a website they were developing. There was nothing in particular that required a desktop application with the exception it needed to be available when the users were offline. I suggested they instead write the data capture part in HTML5, and depend upon their user using a modern web browser (eg anything but IE, or an IE9 preview). In reality this is no more arduous than requiring specific versions of dot net or a jvm to be installed and has the advantage of leveraging the existing work they’d done for the rest of the site.

How does this work? Pages which are required offline need to have a manifest listing their resources, these resources will be cached and made available later when offline. Users can then bookmark these pages, even if the browser is in offline mode they will still be able to get to these pages. This in turn brings in a second problem, data storage - normally developers use the likes of mysql for persistence with PHP or Rails, or something else, for generating the pages. If data is held on the server and needs to be available offline then it can be stored in localStorage, this is a very simple Hash based API for storing data, eg

window.localStorage.setItem(‘mykey’, ‘data to save’) ; window.localStorage.getItem(‘mykey’) ;

I took the approach of just JSON encoding the various data structures to store them in localStorage. WebKit based browsers have a more advanced storage option, they have an sqlite database embedded within them but since thats not an accepted standard yet and Firefox doesn’t support it and theres no word on whether IE9 will, I chose to keep things simple.

The final difference is the lack of a preprocessor - the page can be run through PHP or similar at the point its generated, but if its going to need to change after its cached in the browser, or its showing data from localStorage then those parts will need to be generated by hand in javascript.

The projects not live yet but the data capture now feels like a seamless part of the website, and the users wont need to worry about maintaining or updating a separate capture program. Since I started this project google have helpfully published a lot of information relating to the new specs and features in HTML5.

http://www.html5rocks.com/