What is the meaning of NETWORK and FALLBACK fields in AppCache manifest?

Question

From http://www.html5rocks.com/en/tutorials/appcache/beginner/.

CACHE: This is the default section for entries. Files listed under this header (or immediately after the CACHE MANIFEST) will be explicitly cached after they're downloaded for the first time.

This seems to be the default usage of AppCache. If something listed here is in the cache, use it. Otherwise, download it and cache it.

NETWORK: Files listed in this section may come from the network if they aren't in the cache, otherwise the network isn't used, even if the user is online. You can white-list specific URLs here, or simply "", which allows all URLs. Most sites need "".

What does this mean? This seems to have the same meaning as CACHE.

FALLBACK: An optional section specifying fallback pages if a resource is inaccessible. The first URI is the resource, the second is the fallback used if the network request fails or errors. Both URIs must from the same origin as the manifest file. You can capture specific URLs but also URL prefixes. "images/large/" will capture failures from URLs such as "images/large/whatever/img.jpg".

So by inaccessible do they mean inaccessible from the server? If something is not found in the server, and it is in FALLBACK it sends a request to the fallback resource and caches it? And if next time the original resource is still unavailable, it uses the fallback from the cache? Or if next time the original resource became available, it will clear up the cache and download the original one and cache it?

Answer 1

CACHE: Any file that can be statically served can go in this section (for example images, CSS files or web fonts). Files that need to be interpreted by the server (PHP, Python, etc) cannot go here.

NETWORK: Files that explicitly need a network connection, in other words, resources that require the user to be online. Putting resources in this section will bypass the out cache and try loading the resource from the network. For example Google Analytics, images resources like live cams or some kind of data the as the be loaded over the network.

FALLBACK: Here is where you set app cache alternatives for resources that need to come from the network. For example that live cam image in which you may want to cache an older version of it. The browser will use the rules in this section to load an alternative but only after tried to load the resource from the network first.

I advise you to check the Mobile Web Development course from Udacity. It was where I learned about app cache. It's a wonderful course built by Google and its free!