diff --git a/README.md b/README.md index 9d05efb..fb4a12d 100644 --- a/README.md +++ b/README.md @@ -126,7 +126,7 @@ The full case study at [Lancôme rebuilds their mobile website as a PWA](https:/ By default plugin prevent any third party request being cached and is recommended as every third party request may generate a response of type opaque which causes it to get a minimum 7MB storage space in the cache, more at [https://cloudfour.com/thinks/when-7-kb-equals-7-mb/](https://cloudfour.com/thinks/when-7-kb-equals-7-mb/) . Although it is recommended to not allow opaque response being cached you can allow it using ``` - pwa.app.no.opaque.cache=false + pwa.app.no.opaque.cache=false ``` **Recommended way**: + Keep no opaque cache property as true in PWA.properties [default plugin behavior]. @@ -134,20 +134,19 @@ The full case study at [Lancôme rebuilds their mobile website as a PWA](https:/ + Add any third party request you want to cache to "static_assets.isml" + **Update:** Now you can whitelist your third party requests in service worker by adding them in the array "pwa.app.opaque.whitelist" in "pwa.properties" file. ``` - # If you need some opaque third party request to be cached you - # can either whitelist full domain by adding only origin say: "https://www.example.com" - # or you can whitelist only a specific request by using - # full url: "https://example.com/image/250x250" to the array + # If you need some opaque third party request to be cached you + # can either whitelist full domain by adding only origin say: "https://www.example.com" + # or you can whitelist only a specific request by using + # full url: "https://example.com/image/250x250" to the array - pwa.app.opaque.whitelist=["https://www.example.com", "https://example.com/image/250x250"] + pwa.app.opaque.whitelist=["https://www.example.com", "https://example.com/image/250x250"] ``` 5. #### Handling default app install behaviour - From version [v1.3](https://github.com/vsanse/plugin_sg_pwa/releases) - + you can prevent default [mini-infobar](https://developers.google.com/web/fundamentals/app-install-banners#mini-info-bar) from appearing by using - ``` - pwa.app.preventadd2hs=true - ``` - If you decide to use above property, be sure to provide some [indication](https://vsanse.github.io/plugin_sg_pwa/#window-add2hs-to-rescue) to the user that your Progressive Web App is installable. + From version [v1.3](https://github.com/vsanse/plugin_sg_pwa/releases) you can prevent default [mini-infobar](https://developers.google.com/web/fundamentals/app-install-banners#mini-info-bar) from appearing by using + ``` + pwa.app.preventadd2hs=true + ``` + If you decide to use above property, be sure to provide some [indication](https://vsanse.github.io/plugin_sg_pwa/#windowadd2hs-to-rescue) to the user that your Progressive Web App is installable. 6. #### window.add2hs to rescue From version [v1.3](https://github.com/vsanse/plugin_sg_pwa/releases) window object will have event add2hs which can be used to prompt user to install PWA using `window.add2hs.prompt()`. You can setup some [button or banner](https://developers.google.com/web/fundamentals/app-install-banners/promoting-install-mobile) to indicate user that your PWA is installable on click of which you can trigger `window.add2hs.prompt()` to prompt user to install PWA.