Signalr best practice when phone splash screen comes on

Question

I have a signalr page implementation that works well while looking at the screen. However, if I am on my phone and it goes to a splash screen, and I get back into my phone with the browser window still there, no updates occurred.

I have to wait for the next update, which could take the 5:00 clock when the splash screen appears to say 1:00 clock after I log back in and see the next update. Just doesnt feel right.

Is there a way to keep updating the page or refresh it manually if needed with signalr. What is the best practice?

Another example that just happened is there was 10 seconds left in a game when my splash page occurred. I log back in to view it, and it stills stuck on 10 seconds because no more updates will appear since the game is over.

Answer 1

I just used the Page Visibility API to load the game manually.

               document.addEventListener('visibilitychange', function () {

                    if (document.hidden) {
                        self.focus = false;
                        console.log('hidden');
                    } else if (document.visibilityState == 'visible' && !self.focus) {
                        self.focus = true;
                        console.log('visible');
                        // Load Game via Ajax
                    }
                });