iOS 10 disappearing graphics

martinr

We have an issue with a bunch of different spine files that have left of very puzzled. Graphics disappear on iOS 10 in Safari. Sometimes it reappears, sometimes not. Sometimes it disappears for an instant, sometimes for a longer period of time. We have detected the issue in iOS 10.1 and 10.2. It is not present in 10.3 or 11. We have not yet found an iOS 10.0 device to test on, but on iOS 8 it is not happening. We have narrowed it down to somewhere in the spine typescript runtime since it is happening in various examples on Spine: Demos. For example in the "Transitions and layering" example.

In the video, the animation speed is 0%, however it is also happening with different animation speeds. Note that it only occurs in the example that uses mixing.

We have observed the bug on both canvas and webgl while using our own rendering implementation.

Mario

That is indeed weird. I currently only have an iOS 10 emulator and I couldn't reproduce it with that so far. It seems you can reliably reproduce it on the phone with the example from our demos. Could you try to debug whether any data passed to the renderer is corrupt? E.g. NaNs, etc.

martinr

Somewhere in AnimationState.apply some of the numbers on some bones become NaN. I am actively debugging the issue.

Before applying timelines in applyMixingFrom, the value of 'alpha' was undefined. Before passing it down to the timelines, I tried checking if the value was undefined and throw an error if it was. That never happened and the issue from the video stopped occurring. So in some way, Safari decides that the value of 'alpha' is not needed in that particular code even though it is. The null check however, did not fix a lot of the issues we are having in our game, so I suspect something similar may happen in other places.

Mario

I'll try to get a hold of a iOS 10 device to repro this issue.

martinr

I found a fix that seems to be working. Before calling apply on timelines in AnimationState.apply and AnimationState.applyMixingFrom, pass the 'alpha'/'mix' and 'pose' values to a noop function. Those two values seem to be the only values affected by the issue and passing them to a noop function seems to fix the values being undefined within the timeline.apply function.

On a sidenote, we found that the issue is not iOS specific, but rather webkit specific. We are trying to pin down exactly which version of webkit the issue was fixed in. We have narrowed it down to somewhere between webkit 602 and 603.

Mario

That's fantastic. I expect that the WebKit JIT has a bug that reorders statements resulting in undefined behaviour. I'd be happy to integrate your fix in the official runtime if you can send a PR that you know fixes it in this case. I see if I can reproduce it with one of the WebKit versions you mentioned.

martinr

I have created a PR. We have also made a few performance tests - we found that it is immeasurable. The difference in an iteration of AnimationState.apply is in micro seconds. Sometimes it the version without the fix that is the fastest and sometimes it is the version with the fix that is the fastest.

Mario

Awesome, I'll merge this today. It definitely is a WebKit JIT bug from what I saw in my own testing.

Count0

I'm not sure when it was introduced, but it was fixed in webkit revision 203356.
https://trac.webkit.org/changeset/203356/webkit