Nateowami/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Application Cache notes

Major important things to remember when working with the app cache

https://html.spec.whatwg.org/#manifests

This feature is in the process of being removed from the Web platform. (This is a long process that takes many years.) Using any of the offline Web application features at this time is highly discouraged. Use service workers instead. [SW]


Contrary to  one source, it appears the spec still requires the text/cache-manifest mime-type. Older browsers do as well, and its unclear which ones, so we should probably use it for the sake of the many devices running the older Android browsers.

The cache is not refreshed unless the manifest file itself changes.

The three sections, which can occur multiple times in a single manifest file (https://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.
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 "*".
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".

Files always come from the application cache, even if you’re online. After the user visits the page the browser will fetch the manifest file. If it has changed, then it will attempt to update the application cache. Changes will not take effect until the page is reloaded.

When the cache is refreshed regular caching rules still apply. E.g. if a file is permanently cached, when the manifest file changes that file will be "requested" like usual, but like usual it will be loaded from the browser's cache because it's cached permanently. Make sure caching rules are explicit so the browser doesn't make up guesses.

By default, when a page is loaded from the app cache (which occurs even when online) the page is not allowed to load any files that are not in the cache. To change this you have to put * in the network section to white list all URLs to be available over the network.

If you declare the app cache on a page, that page is implicitly included in the cache. This means every page a user visits will get included into the cache as they browse to them. If you want to just declare everything that should be offline in the application cache, you can include a hidden iframe that points to the manifest file.

If you include a fallback (e.g. / fallback.html in the FALLBACK section to make everything fallback to that file) all requests offline will "succeed" with a 200 status, even though you're offline. That means even XHR requests for a JSON file will return this fallback with a success status, and it will likely be attempted to parse it as e.g. JSON.
Furthermore, older versions of WebKit will return a status code of 0 for XHR requests that return cached file. This is usually interpreted as an error.

https://developer.mozilla.org/en-US/docs/Web/HTML/Using_the_application_cache

Some browsers (e.g., Firefox) display a notification bar the first time a user loads an application that uses the application cache. The notification bar displays a message such as:


This website (www.example.com) is asking to store data on your computer for offline use. [Allow] [Never for This Site] [Not Now]


Relative URLs are relative to the manifest’s URL (https://www.sitepoint.com/common-pitfalls-avoid-using-html5-application-cache/)

https://developer.mozilla.org/en-US/docs/Web/HTML/Using_the_application_cache

addition, the browser also sends a checking event to the window.applicationCache object, and fetches the manifest file, following the appropriate HTTP caching rules.

Make certain that the manifest is not cached (except e.g. caching that will simply ask the server if there are updates).

Further reading (contains a lot of what's already here): https://www.sitepoint.com/common-pitfalls-avoid-using-html5-application-cache/