A Problem Repeatedly Occurred on a safari! Phaser 3 | iPhone

Phaser 3
1

photo_2024-02-13 11.56.27

Hi everyone, I develop games using the Phaser 3 framework. Recently I have a problem with the fact that my game when loading starts to restart 2-3 times and then writes the error “A Problem Repeatedly Occurred on a safari!”. And this problem only on iPhones, regardless of the version of the system, while on android and on the computer I do not have this error.

A little backstory, before this did not happen, it all started after I added loading atals to my game.

Atlases I add as written in the official documentation Phaser 3.

A little code for an example:

preload(): void {
this.load.atlas(
            "test-name"
           testImgSrc,
           testConfigSrc
        );
}

create(): void {
this.image = this.scene.add.image(0, 0, "test-name", "test-img");
}

Atlases do not exceed the size of 2000x2000 and not more than 2 megabytes.

There are 3 atlases in total, no errors in the logs.
Phaser version - “phaser”: “^3.60.0”;

Important otsupleniya that atlases themselves load correctly, this proves that I have on my iPhone sometimes the game can load normally and I can even play, but, sometimes still sometimes when loading pops up this error.

2

Hi @vladyslavfolkuian, I also have the same issue on Safari on iPad, while it’s fine on other browsers. Have you found a way to fix it?

3

I’ve just solved my case with this error. For future generations:
I used to use Phaser.Scale.EXPAND. And I found, that this was leading to resize storm. Phaser.Scale.EXPAND changes margins of parent DOM element, probably this is connected with the issue. Browsers like Chrome are more tolerant of this.

How to fixed this?
a) Try another scale mode than Phaser.Scale.EXPAND
b) Write you custom resizer. Now I use CSS to scale game region and my canvas size is updated by code with scale.setGameSize. Also my first resize happens after some timeout. This is almost 100% stable.