Peter Lubbers - Pro HTML 5 Programming

246
CHAPTER 10 ■ CREATING HTML5 OFFLINE WEB APPLICATIONS
Due to the varying levels of support, it is a good idea to first test if HTML5 offline web applications
are supported before you use these elements.
Using the HTML5 Offline Web Application API
In this section, we will explore the specifics of how you can use the Offline Web Applications API.
Checking for Browser Support
Before you try to use the Offline Web Applications API, it is a good idea to check for browser support.
Listing 10-1 shows how you can do that.
Listing 10-1. Checking Browser Support for the Offline Web Applications API
if(window.applicationCache) {
// this browser supports offline applications
}
Creating a Simple Offline Application
Let’s say that you want to create a one-page application that consists of an HTML document, a style
sheet, and a JavaScript file. To add offline support to your HTML5 application, you include a manifest
attribute on the html element as shown in the Listing 10-2.
Listing 10-2. The manifest Attribute on the HTML Element
.
.
.
Alongside the HTML document, provide a manifest file specifying which resources to cache. Listing
10-3 shows the contents of an example cache manifest file.
Listing 10-3. Contents of an Example Cache Manifest File
CACHE MANIFEST
example.html
example.js
example.css
example.gif