The HTML5 Application Cache mechanism assists us with the development of web applications that can work offline. Using this mechanism we should create a manifest file that lists the resources (files) we want the web browser to keep their copies offline.
The following code sample includes the demo.html file that refers sample.caching. The later lists the files that the web browser should keep their copies in order to allow the web application to work offline.
The following is the sample.html file. It includes the manifest attribute in the <html> tag. The URI address the manifest attribute is assigned with can be either a full complete address or a relational one.
<!DOCTYPE html> <html manifest="sample.caching"> <head lang="en"><meta charset="UTF-8"> <title>Application Cache Demo</title> </head> <body> <h2>Application Cache Demo</h2> <img src="android.png" width="480" /> <br/> <img src="java.png" width="480" /> </body> </html>
The following is the sample.caching file. It lists the files we want the web browser to keep their copies in order to allow an offline application to function.
CACHE MANIFEST # version 1.0.0 demo.html android.png java.png
The following video clip explains the execution of this code sample, overviews its code and explains it.
You can find the source code of this code sample as well as many other code samples in the ‘Introduction to HTML5’ course at http://abelski.lifemichael.com.
