Advice for helping debug a browser crash on ios devices

[codetemplar]

Hi all,

This is quite an open ended question unfortunately because I am completely at a lost on how to proceed.

I have developed a few browser based games in javascript using pixijs. On my test ios devices (ipad air 2, iPhone 5s and iPhone 7) in both safari and chrome I randomly get a browser message saying "A problem occurred with this webpage so it was reloaded". Sometimes it occurs after 10 seconds and sometimes after 15 minutes, there is no common interaction that causes the crash, just is apparently random. The older versions of my games are using pixi 4.2.2 whilst the newer are 4.7.0 and it happens on both versions.

I have never seen this on Windows desktop or Android mobiles. I don't believe the error will be anything to do with Pixi but to do with a common library I have developed around Pixi that all my games use.

I bought a mac mini to help debug the issue on my iPhones and ipads using Web inspector so I can see any console logs. I cant simply render the console logs to the screen as the rendered gets obliterated at the point of crash. Interestingly the game doesn't crash when running on the Mac mini desktop (Mac OS), only  on iOS devices. It also stops crashing on my iPhone and ipad whilst the mac mini is debugging it using Web inspector. So far I am having no luck. As I cant get it crashing when debugging with web inspector to see the console logs I have added some code which forwards console logs over a network connection so it can be stored remotely but the logs show nothing on crash. I have also put a try catch block inside requestAnimationFrame and log any throws, but nothing is caught. I have zero experience on Apple products and am now completely out of ideas on how to find out what's going on.

Obviously I don't expect anyone to tell me what the problem is but maybe you can think of alternative debugging techniques that I haven't thought of that I can try? Or any additional information I can provide to help progress

This is happening on all games I have written using my framework. Some games have 100+mb of assets and some have < 2mb.

Thanks for any help.

 

Many thanks

[Exca]

I have had this exact same issue and havent found any common factor except resource usage.

At first I thought it was about webgl context being lost. But then I managed to get it to happen on a 2d context only page. Also removing amount of sounds used seemed to help in some cases, but not in all.

Currently I'm pretty sure it has something to do how much ram the game uses. As I can get it to occur much more easily on ipad mini 1 vs. ipad mini 2 vs mac mini.

[codetemplar]

Thanks for the reply. So I assume yours is just apple related too? When you get ti crashing on mac mini does the web inspector show you anything of use?

[Exca]

Yep, apple related. Havent gotten mac mini to crash properly. Had it for one day only so didn't have much time to test.

[jonforum]

Hum, since lot of time i not try debug on my tablet

step1: hack your phone or tablet with Root  and debug mode to allow USB debug.
If i remember someTime you need a special rom or sometime your are allowed by hold 5sec information to open the secret dev menu.
Or sometime you need to do nothing, i remember on my samsung it ok , but my honda need a lot of hack.
step2: install intel XDK on your phone or tablet and your PC.
ste3: Connect by usb your phone or tablet, you will get alert in your phone to allow  remote debug USB.
step4: open intel XDK on PC, scan device and connect to device. It will found your phone and connect to the client installed.
Step5: Wait the transfer, en enjoy debug tool from PC to phone  no need compile .APK.

You PC are updated from your phone or tablet.
i made a very old tutorial here to show you how debug from PC to Tablet.
It a rmmv performance game test that use pixijs and nwjs.
hope it can help you

So it will allow you fully play, debug, manage break point, scan memory and understand your crash log directly from your PC or Mac.
All what your see are livre from your tablet, phone and you can also emulate all phone type your need.... to see if your game can have issue on other modele phone.

 

 

[themoonrat]

I'll just echo what @Exca said. My experience matches; getting similar random crashes on lower end apple devices. I think it is a memory issue, either ram or on the GPU; a combination of reducing the amount of assets (textures and sounds) and reducing the resolution (textures) meant the random crashes went away.

Once things got stable, I created hard set in stone asset asset limits for those older devices.

[codetemplar]

Are you able to share what your hard set in stone limits are to see where I fall in there please? One of the games I am seeing it in has a 6.5mb mp3 sound sprite file with fallback 13mb wav file. Our graphics folder is 3.3mb pngs (on disk) at 1920x1080 resolution. We are seeing this on the iphone7 too

Thanks for your help

[themoonrat]

So, it's not strictly really based on the size to load, as both textures and audio will get decoded when loaded onto the device. 

Texture wise you're gonna be fine, as long as you're texture atlases are 2048x2048. Those phones do support 4096x4096 but can struggle with swapping such large ones in and out of gpu memory. But that's more of a performance at runtime issue than a 'crash' issue.

So that leaves the sound. I personally wouldn't have more than a few minutes of audio on an older device, regardless of compression. Try reducing this right now for testing purposes and see if the stability increases

 

[jonforum]

textures > 2048 should give jittering on mobile , like this but no crash app! 

https://youtu.be/VP3dQdNhZ3o

Impossible to emit theory without a log of error.
Thousands> of things can go wrong here.
Just show the log of the error and we will can help you.
it can be also invalide invalid characters ((“\\/:*?\”<>|") )  that make crash app somewhere in game, i remember get crash in game with some files name with invalid compatible chara for android.. 
Work on window, but not android..
Are you able to show a log ?

[Exca]

6 minutes ago, jonforum said:

textures > 2048 should give jittering on mobile , like this but no crash app! 

https://youtu.be/VP3dQdNhZ3o

Impossible to emit theory without a log of error.
Thousands> of things can go wrong here.
Just show the log of the error and we will can help you.

With ios devices it's pretty hard to get error logs without macos & developer unlocked phone. At least I havent found a way to easily get errors out from ios (where page has complete crash).

[jonforum]

4 minutes ago, Exca said:

With ios devices it's pretty hard to get error logs without macos & developer unlocked phone. At least I havent found a way to easily get errors out from ios (where page has complete crash).

i know nothing about apple, but true, it seem you need special hack like xcode? are you allow to do this ?
https://developer.apple.com/xcode/
btw, on the video i show you upper, you are allow to connect a ios phone for debug and get log.

[Exca]

You can use safari remote debugging also https://www.lifewire.com/activate-the-debug-console-in-safari-445798

Though that only works on macos.