-1

I have a PWA (progressive web app) application that is meant to be “installed” by the user. For the most part, everything works pretty good except for one small problem. The problem is that when the application is minimized (not closed), the data becomes stale after a while and ideally, I would like to automatically refresh the information when the user pulls up the app back again.

After some research, I don’t seem to be able to find an event on the HTML element that would trigger when the page is activated (when the user pulls the app up). If such an event existed, I would use that event to run some code that would fetch the latest and greatest information from the server and sync up the user interface info, or at the very least, run some code that automatically makes a call to refresh the page.

By the way, I tried looking into technologies such as websockets and server-sent events to maintain the user interface data up to date but that gets kind of complicated and even if I get that to work, looks like I will end up having to deal with all kinds of disconnect issues which puts me back on square one.

So my question is, what would be the best way to accomplish what I am trying to do?

Thanks.

6

1 Answer 1

0

Use the visibilitychange event: -

document.addEventListener("visibilitychange", visibilityChange);

For a complete working example see the BackgroundGeolocation solution.

If you want to get more adventurous or "better" then you could use the Cache API with a ServiceWorker and then satisfy your Fetch request from Cache (where possible) whilst simultaneously asking the server for a fresh copy for the "next" query.

IMHO, the best way to replicate data is "Not at all!". But then the nature of my Apps renders them as useful as teats on a bull without a network. Also we have 5G wireless being installed as we speak. I'll let Jake look after mid-Saharan Africa.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.