background preloader

OFFLINE APPS

Facebook Twitter

Debugging HTML 5 Offline Application Cache : Jonathan Stark. September 27, 2009 If you are looking to provide offline access to your web app, the Offline Application Cache available in HTML5 is killer. However, it's a giant PITA to debug, especially if you're still trying to get your head around it. If you are struggling with the cache manifest, add the following JavaScript to your main HTML page and view the output in the console using Firebug in Firefox or Debug > Show Error Console in Safari. If you have any questions, PLMK in the comments. HTH, j. A Beginner's Guide to Using the Application Cache. Introduction It's becoming increasingly important for web-based applications to be accessible offline. Yes, all browsers can cache pages and resources for long periods if told to do so, but the browser can kick individual items out of the cache at any point to make room for other things.

HTML5 addresses some of the annoyances of being offline with the ApplicationCache interface. Using the cache interface gives your application three advantages: Offline browsing - users can navigate your full site when they're offline Speed - resources come straight from disk, no trip to the network. Resilience - if your site goes down for "maintenance" (as in, someone accidentally breaks everything), your users will get the offline experience The Application Cache (or AppCache) allows a developer to specify which files the browser should cache and make available to offline users. The cache manifest file Referencing a manifest file <html manifest="example.appcache"> ... Note: "/page-url/", "/page-url/? Get off(line) Taking your web sites and apps offline with the HTML5 appcache There’s a general (and understandable) belief by even many developers that web sites and web applications can only be used when the browser has a web connection.

Indeed, this is routinely cited as one of the real advantages of “native” apps over web apps. But as unintuitive as it sounds, in almost every modern browser and device (except even for now IE10 developer previews, but here’s hoping that changes), that’s not the case, provided the developer does a little extra work to make their app or site persist when a browser is offline. (Of course the user must have visited your site while their browser did have a connection) In this article, I hope to clear this whole areas up once and for all, show you how to do it, and point to some great resources out there for learning more about creating offline versions of your web sites and apps. Making a cache Making it manifest An appcache manifest Here is a very straightforward example. Offline iPhone Web Apps. One of the several features outlined in the HTML 5 specification is the support for Web applications that continue to work while they are offline.

This feature is very useful for Web applications because a Web application can be loaded just once and then run offline without needing a persistent Internet connection, making it behave just like a locally installed native application. Dashcode supports the manifest attribute available in the HTML 5 specifications for offline web applications. And so in this article, you will learn how to write offline iPhone Web applications using Dashcode. Enabling Offline Mode To enable your iPhone Web applications to run in offline mode, you first need to configure your project in Dashcode. Using Dashcode, create a new Custom project, save it and name it as OfflineApp. Click on the Application Attributes tab and check the “Allow offline viewing of this web application” option (see Figure 1).

Figure 1.Enabling your application to run in offline mode Figure 2. Appcache Facts. ManifestR - offline web apps made easy (well easier)