Performance Issues Suffered With Spines Containing Masks

[TyroTheFox]

Hi,

When working with this using PIXI v6.5.8, and attempting to run a number of Spine animations on-screen that all contain Masks that allow for a shine to wash over particular parts of the sprite to mimic a light source.

The issue is that I'm getting huge issues with performance. The culprit appears to be masks causing huge issues with how many calls to the GPU due to how much the stencil buffer is being abused and that's all obvious. The issue is that these spines are causing crashes I'm not convinced are intentional and I'm trying to narrow down whether I'm doing something off, or the code is. Or maybe even the spines themselves.

Firstly; on my PC; a modest machine that handles the work OK up until you throw on one of these spines. It's running an Integrated Intel GPU my computer insists is updated properly. When it tries to run the game I'm working on, it flops hard. Only a few minutes before the game declares that the WebGL context is kaput and crashes out. Impact is nuts, is to be expected.

A colleague ran the same thing on another machine with a proper NVidia GPU, a machine way above mine. After 30 minutes or so, it would then suffer massive slow down. It couldn't handle the load of everything after that time. My gut tells me there may be a memory issue for animations that are being displayed, even when idle and not being updated by the function. Especially as the more powerful machine doesn't simply crash but slowly comes to a halt. I know that spines are a costly element to a PIXI project but should they be this bad? I only have so many machines to test with so I can't fully figure this one out but I would like to check if there's anything I can do myself to help here at all.

Firstly, I want to ask if this is trending with anything anyone else has been experiencing? How significant are masks on the performance of a spine?

On that note, previous comment sounding sort of similar, linked below, suggested that there was a possible hack on the update function?

https://github.com/pixijs/spine/issues/317#issuecomment-544564774

Firstly, would this help in my case? And if so, where is this function and could I still do this hack? The original comment's link points to nothing now? Did others figure out how to fix the problem?

Thanks for your time.

[ivanpopelyshev]

that allow for a shine to wash over particular parts of the sprite to mimic a light source.

month ago i helped a guy who had this problem , we removed managed to remove masks through usage pixi-heaven plugin but we had to modify it seriously, this is real job and the code is not ready for open-source general usage.

When it tries to run the game I'm working on, it flops hard. After 30 minutes or so, it would then suffer massive slow down

This is browser problem. Report it with a demo to chromium, and tell exaclt configuration, which videoard is it.

The only serious technical detail i can tell you - we are using STENCIL masks. If that doesnt tell you anything, im afraid you have to ask your artist-animator to not use masks in spine. You can also ask around in pixijs discord just in case there are other people who suffer from that.

As I hope you understand, we use things that should work in modern browsers.

[TyroTheFox]

This is browser problem. Report it with a demo to chromium, and tell exaclt configuration, which videoard is it.

The only serious technical detail i can tell you - we are using STENCIL masks. If that doesnt tell you anything, im afraid you have to ask your artist-animator to not use masks in spine. You can also ask around in pixijs discord just in case there are other people who suffer from that.

As I hope you understand, we use things that should work in modern browsers.

Thanks for replying. I'll chat to the artist for the time being. I will mention something odd that I'm would like cleared up if you can: this is an issue I experience with Chrome. I threw it into Firefox and it works fine. Both are updated versions. Probably confirms what you say here but I did find it weirdly suspect.

[ivanpopelyshev]

Yes, stencil masks and scissor masks are repeatedly broken through the versions. While you are at it, can you please try it in Chrome Canary ?

[TyroTheFox]

Just gave it a whirl. Same errors.

This is what ultimately happens.

[ivanpopelyshev]

Well we can add triangulation implementation from spine-ts and support geometry masks , but that will be very slow. However in that case we can add "stencil: false" in pixi (still not supported but easy to hack), and it'll enable webgl in some devices.

Pick your poison.

[TyroTheFox]

So just to make sure I follow: either we add the ability to add even heavier means of using masks, or we disable the stencil buffer?

[ivanpopelyshev]

Hm, alternatively we can always use SpriteMaskFilter instead of stencil , its an option that can be added fast in pixi-spine.

[TyroTheFox]

Hm, alternatively we can always use SpriteMaskFilter instead of stencil , its an option that can be added fast in pixi-spine.

Interesting. Willing to give it a whirl if you are.

[TyroTheFox]

Hm, alternatively we can always use SpriteMaskFilter instead of stencil , its an option that can be added fast in pixi-spine.

Hi. I don't mean to shove but did you look into this at all?

[ivanpopelyshev]

I'm sorry, I have weeks-length backlog :( You can create a discussion or issue in main pixijs repo, and post a small bounty on it. Name should be something like "Use filter mask instead of stencil if its not available". Or you can wait, I'm gonna check many issues related to pixi-spine in next week anyway

[TyroTheFox]

I'm sorry, I have weeks-length backlog :( You can create a discussion or issue in main pixijs repo, and post a small bounty on it. Name should be something like "Use filter mask instead of stencil if its not available". Or you can wait, I'm gonna check many issues related to pixi-spine in next week anyway

Cool. I wasn't certain there so thanks for clarifying. I might give it a whirl myself. I'll let you know on my progress. Thanks for when you do look at this yourself.