This document discusses how to build offline web applications using HTML5 application cache. It begins by introducing offline applications and the browser support for application cache. It then covers checking for browser support, manifest files that list cached resources, and the applicationCache API for updating the cache and handling cache events like downloading, updating and errors. The key aspects are checking browser support, using a manifest file to define cached files, and the applicationCache API to control caching and respond to status changes.

1. HTML5Offline Web Applications Wilson Chen

2. Agenda Introduction Browser Support Browser - applicationCache API Checking for Browser Support Offline/Online Manifest Files applicationCache

3. Introduction What is Offline Application? offline cache Why is it important?

4. Advantages Offline browsing Speed Reduce loading on server

5. Browser support http://caniuse.com/#search=offline

6. How to check? Check if window.applictionCache exists or not if(window.applicationCache){ // the browser supports } else { // it doesn’t }

7. Offline / Online Navigator.onLine is a boolean property to indicate online or not online/offline events of window object

8. Manifest file manifest lists resoures which browsers will cache for offline use Content-type is text/cache-manifest

9. Manifest file CACHE MANIFEST CACHE Serve these files from applicationCache, even if online NETWORK Alway fetch these files from internet FALLBACK Alternate paths to replace resources that can’t fetched

10. applicationCache API applicationCache.update() Trigger cache update applicationCache.status

11. applicationCache API applicationCache event

12. applicationCache API- checking event Dispatched when the user agent is checking for an updatem or attempting to donwload the manifst for the first time. This is always the first event in the sequence

13. applicationCache API- downloading event Dispatched when the user agent has found an update and is fetching it, or is downloading the resources listed by the manifest for the first time.

14. applicationCache API- updateready event Dispatched when The resources listed in the manifest have been newly redownloaded. swapCache() to swith to the new cache

15. applicationCache API- obsolete event Dispatched when The manifest was found to have become a 404 page or 410 page, so the application cache is being deleted

16. applicationCache API- cached event Dispatched when the resources listed in the manifest have been downloaded, and the application is now cached.

17. applicationCache API- error event Dispatched when The manifest was a 404 or 410 page, so the attempt to cache the appliction has been absorted The manifest hadn’t changed, but the page referencing the manifest failed to download properly A fatal error occurred while fetching the resources listed in the manifest

18. applicationCache API- noupdate event Dispatched when the manifest hadn’t changed

19. applicationCache API- progress event Dispatched when the user agent is downloading resources listed by the manifest

20. Q&A