• Advantages: Browse when there is no network, which speeds up resource loading and reduces server load
  • Use: just add < HTML manifest=’cache.manifest’> to the header of the page and create the manifest.appcache file
  • Manifest.appcache file configuration:
    • 1)CACHE MANIFEST is placed in the first line
    • 2)CACHE: Indicates the list of resources that need to be stored offline. The page containing the manifest file is automatically stored offline, so it does not need to be listed
    • 3)NETWORK: indicates the list of resources that can be accessed online. If the CACHE list also exists, the CACHE has a higher priority
    • 4)FALLBACK: if the first resource is accessed, use the second resource to replace it
  • How does the browser parse the manifest
    • Online: When the browser finds the MANIFEST attribute in the HTML header, it requests the manifest file. If it is accessed for the first time, the browser will download the corresponding resource according to the manifest file and store it offline. If the file has already been accessed and stored, the browser uses the value of the offline resource and compares it to the new file. If the file has not changed, it does nothing. If the file has changed, it redownloads the resource in the file and stores it offline
    • Offline: The browser directly uses offline storage resources
  • Differences from traditional browsers
    • 1) Offline cache is for the entire application, browser cache is a single file
    • 2) Offline cache can actively notify the browser to update resources
  • Status The status property of the window.applicationCache object
    • Zero: no cache
    • 1: idle
    • 2. The description file is being downloaded and checked for updates
    • 3: download
    • 4: The update is complete
    • 5: deprecated. The description file of the application cache no longer exists, so pages can no longer access the application cache
  • Event Events related to the window.applicationCache object
    • 1)oncached: This event is triggered when offline resource storage is complete
    • 2)onchecking: Triggered when the browser checks offline storage resources for updates
    • Ondounloading: Triggered when the browser starts downloading offline resources
    • 4) onProgress: triggered when the browser downloads each resource
    • 5) onUpdateready: Triggered when the browser completes updating the offline resource
    • 6) onnoupDate: triggered when the browser checks for updates and finds no such resource
  • Matters needing attention
    • The offline storage capacity of a site is 5M
      • If the manifest file, or one of the internally listed files, does not download properly, the entire update process is considered a failure and the browser continues to use the old cache entirely
      • The HTML that references the MANIFEST must be cognate with the MANIFEST file, in the same domain
      • The relative path used in the manifest file as a relative reference
      • The CACHE MANIFEST string is hard on the first line and is essential
      • The system automatically caches HTML files that reference manifest files
      • In the manifest file, CACHE has no relation to the location order of NETWORK and FALLBACK. If the CACHE is declared implicitly, it must be declared first
      • Resources in FALLBACK must be cognate with the manifest file
      • When a resource is cached, the browser requests the absolute path directly to access the resource in the cache.
      • Even if other pages in the site do not have the manifest attribute set, the requested resource is accessed from the cache if it is in the cache
      • When the manifest file changes, the resource request itself triggers the update