Working with service worker for sync/push in DEV mode
Our app (PWA) use SW for 3 purposes :
- Caching statics resources
- Push notifications to user
- Sync data with the server
For productivity reason we need to be able to have SW active for the 2 last points in DEV mode : How can we manage ?
Today, all the features working in PROD mode, but it’s not very efficient for debugging and adding new features on SYNC/PUSH…
As I’ll understand the way to do it, I could send a PR to the doc…
Working with Quasar 0.16
The main problem with SW on dev mode is that it breaks HMR (Hot Module Reload) since SW caching would be in effect. If you find a clever way to make both SW and HMR happy, I’d be thrilled to integrate the solution.
@rstoenescu I will find a solution keep on touche !
@rstoenescu I read the code from quasar-cli and I think, the solution could be like this…
Create (when generating app or whatever when) 2 other files in the src-pwa :
- File one : push-service-worker.js : Which would be all in comment, but let the dev putting his code about listenning “push notification”
- File two : sync-service-worker.js : Which would be all in comment, but let the dev putting his code about listenning “sync notification”
In “dev mode”, quasar-cli answer automatically to the GET service-worker.js with the no-op template : Perfect ! Just add the content of the two files above to the response
In “prod mode”, quasar-cli building the service-worker.js depending of options (params), let’s do the same and add the content of the two files above at the end of the file
In a perfect world, user could define, in the quasar.conf.js 2 settings under the [pwa] section :
- usePushServiceWorker : true/false | To add the push part to the generated SW
- useSyncServiceWorker : true/false | To add the sync part to the generated SW
I tried to make it work, but running Quasar-CLI on my PC was not so easy…
Al1_andre last edited by
@sebastien-roul +1 for this solution. I try to create a PWA and it’s a little complicate for someone not having a huge background in PWA things. Actually my main difficulty is to deploy the created PWA and to be able to install it on a smartphone. I have no idea how to add Sync and Push service and Google Audits tells me my app does not register a service worker.
@rstoenescu I think a PWA dedicated howto should be really appreciated.