Grav: Service Worker cache offline is it possible with Grav ? and how ?

Created on 28 Sep 2017  路  2Comments  路  Source: getgrav/grav

@rhukster

Sorry, but I wasn't clear with my first question about PWA , I would like to use a Service Worker that is a require to be PWA, by this way I could access to my Grav Website completely offline, and I don't know how to do that exactly because Grav it's dynamic without any static file, what will be the best tools for that, there are many tools like :

https://github.com/NekR/offline-plugin
https://github.com/GoogleChrome/workbox
https://github.com/GoogleChromeLabs/sw-precache

Thanks for your help !

Most helpful comment

I know this issue is old and closed but there is very little information out there on making grav into a PWA.
1) you CAN use a service worker to precache anything with static links, like /user/themes/mytheme/fonts/myfont.woff2 .
Since the service worker usually installs after the first page load that only really helps speed up other pages that use other fonts, other js scripts etc
2) you can NOT PREcache dynamic pages but you CAN cache them into the applications runtime cache as they are loaded first time.
3) make sure your server does NOT cache the service worker, setting a no-cache header or you will not be able to update it, something you need to do to cache bust when you update your content
4) This one https://googlechrome.github.io/samples/service-worker/basic/ does precache and runtime and works offline once the pages are cached. Some of the other service workers I found seemed to be out of date or just plain broken.
5) use the lighthouse audit in chrome dev tools to test it is working.
6) you need a site manifest to get some of the PWA stuff to work like "add to home screen"
7) the service worker goes into the site root, getting to to register at the bottom of the body of your base or homepage template seems to work for me. It should only update the service worker if it has changed (assuming you have done 3) and the browser cache doesn't interfere).

Hope that helps someone trying to add PWA features to a grav site in future.

All 2 comments

Grav is written in PHP, which is stateless and runs under a webserver. You would need to create your service worker in another language that runs outside of Grav and can then run as a service.

I know this issue is old and closed but there is very little information out there on making grav into a PWA.
1) you CAN use a service worker to precache anything with static links, like /user/themes/mytheme/fonts/myfont.woff2 .
Since the service worker usually installs after the first page load that only really helps speed up other pages that use other fonts, other js scripts etc
2) you can NOT PREcache dynamic pages but you CAN cache them into the applications runtime cache as they are loaded first time.
3) make sure your server does NOT cache the service worker, setting a no-cache header or you will not be able to update it, something you need to do to cache bust when you update your content
4) This one https://googlechrome.github.io/samples/service-worker/basic/ does precache and runtime and works offline once the pages are cached. Some of the other service workers I found seemed to be out of date or just plain broken.
5) use the lighthouse audit in chrome dev tools to test it is working.
6) you need a site manifest to get some of the PWA stuff to work like "add to home screen"
7) the service worker goes into the site root, getting to to register at the bottom of the body of your base or homepage template seems to work for me. It should only update the service worker if it has changed (assuming you have done 3) and the browser cache doesn't interfere).

Hope that helps someone trying to add PWA features to a grav site in future.

Was this page helpful?
0 / 5 - 0 ratings