How to handle page rehydration on mobile device

Hi All,

I am running into an issue on iPads using Safari that I am hoping someone can point me on the right direction on.

The aurelia application (azure backend api) is for a flight school and is used in iPads for doing training logs, pre-flight data entry, and post-flight data entry.

All this generally works fine. However, the iPads are also used with an Electronic Flight Bag (moving maps, navigation, etc…, which is pretty resource intensive), so the browser is put into the background during most of the flight, and is only refocused once the flight is over and they are finishing up time-cards, and flight logs.

Now what previously happened was the student would open browser back up to the app, but be to far away for a wireless network connection. I managed that by using the document onBlur event to check if the server can be hit (not just a network connection) and was able to reduce/resolve all the errors that would cause with connection/loss of connection/re-connection.

The error I am now trying to overcome is that it appears Safari is tombstoning the Aurelia app, and when the browser is brought back into focus if a form was left open it looks complete, form fields have the last entered values, but all the state data for the page model is lost.

Is there a lifecycle event in Aurelia that would capture this type of issue where I could check and try to rebuild the model, or perhaps redirect them?

1 Like

Maybe nosleep?

2 Likes

Thanks for point to that.
The issue here though is not the device sleeping or locking.

Its that when the browser becomes a background app iOS or the browser appears to be freeing resources for the foreground app, but when its brought back to the foreground, its not a complete restoration.

1 Like

I am not sure on the issue exactly, but I would think that this would solve that issue as well. It will not allow iOS to put the safari tab thread into a sleep state.

1 Like

Okay, I see what you’re thinking finally.
The issue is this application should step aside for the EFB application. The EFB is much more important and should be able to get all available resources as it is more a safety of flight issue then the browser.
I could try it, but its not a solution I would want to do more then test.

1 Like

Well you could store entries into localstorage. Maybe the PageVisibilityAPI can help to detect the App opening again so you can load back the data. https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API

This is most likely nothing specific to Aurelia so try searching for general js ios hibernation Events

3 Likes

I would second @zewa666 and also look at service worker events and local storage.
https://w3c.github.io/ServiceWorker/#user-agent-shutdown

1 Like

So I am using aurelia-state and the middleware rehydrate service.
The state works fine when closing the tab and reopening the app, localstorage has the current state properties, etc…

That why I was asking about what lifecycle should happen when the browser does this as appears that the state is not available when the error occurs as the missing data is pulled from there.

1 Like

Doesn’t safari have a pageshow/pagehide for storage/hydration?

1 Like

So you are saying it is truncating the localstorage? That would be weird. Is there a way to force this behavior in the iOS simulator?

1 Like

No, I am saying that it appears to not be restoring the state that is present and correct in localstorage when Safari does this hibernate/restore. It only happens if its not reopened within ~20-30 minutes (flight times are anywhere from 20min to several hours)

Let me show you what I am doing here in the vm with issue when I get back to my dev machine.

1 Like

I will look at that, thanks.

1 Like

So in going through the code to put here for further discussion I discovered some logging I had placed wasn’t in the right spot to capture what I was looking for.

I am going to shelve this till I can get some further logging to see if I can narrow this down, and have better information on what appears to be happening.

Thanks everyone who has provided feedback. I will update when I get that.

2 Likes

I don’t have any first hand knowledge of this but ran across this page that discusses PWA lifecycle on iPads and thought it might be relevant: https://medium.com/@firt/whats-new-on-ios-12-2-for-progressive-web-apps-75c348f8e945

2 Likes

Thanks @scotru, I will check that out!

1 Like