Skip to content
This repository was archived by the owner on Sep 5, 2024. It is now read-only.
This repository was archived by the owner on Sep 5, 2024. It is now read-only.

Docs: Add appcache manifest docs for offline support #1103

Closed
@epelc

Description

@epelc

Well I started reading about appcache last night and got a decent version working in my app. So I thought it'd be really cool if it was added to the angular material docs since it's a perfect application for offline support.

What is it?

AppCache is the acronym for Application Cache. As the name suggests AppCache is a technique for implementing offline HTML5 web applications.
For those of you who don't know what appcache is it's essentially a manifest file that tells the browser which files your app needs to run offline. As a side benefit when you are online your app will load files right from this cache instead of from the server.

Which browsers support it?

Essential most recent versions of chrome, firefox, safari and ie 10+. Which is pretty good since our target audience is developers so everyone should benefit from this.
http://caniuse.com/#feat=offline-apps

Why we need it

This would make viewing the docs offline a lot easier since if you currently wanted to do so you would have to clone the repo install a bunch of build tools then build and run the docs. Which is not very user friendly + it forces you to at least git clone ahead of time.

What I learned while adding it to my own app

  • With angular you tend to have to make a "appcache loader" file which is just an html tag with the manifest attribute
    • you need to do this because of the concept of master entries which basically add any page to the cache automatically if they include the manifest
  • You can only cache js files that are on the same domain(I haven't yet confirmed if they can be on a subdomain yet)
    • html and css files can be on any domain
    • The biggest problem with this is you must host angular and other common libraries if you want to display anything more then a basic html page when your user is offline. You may be able to get around this with some js though as there is a decent js api that comes with the appcache.
  • You will probably need NETWORK: * see why in the mdn docs below
  • You will want to be generating the manifest file when you end up deploying. This means it will need to be added to the build process. gulp-manifest may be helpful but I haven't tried it yet

Helpful links

I'll add more information as I finish my implementation into my own app. However It shouldn't be too hard to add since the docs don't depend on a rest api.

As a side note not many doc projects are using this yet(but they all should) so it'd make angular-material look alot better.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions