Masks usage with spine

[GMihalkow]

Hi. At work we're having performance problems when using multiple pixi masks on mobile. Pixi-heaven is one of the options we're reviewing as a possible solution to the problem. We're using PIXI.js version 6.0.4.

After running several tests with the sprite masks which pixi-heaven supports, we saw a performance improvement. But we also use spine in some projects. I'm having problems figuring out how sprite masks are used with SpineMesh. I get a console error. I even tried to use a sprite with a maskSprite as a container for the spine. But the mask seems to not apply to any of the Spine Mesh children.

Demo:

https://www.pixiplayground.com/#/edit/21YI4PTVR8Qkl9Rk8gQQN

[ivanpopelyshev]

There's special logic for spine in pixi-heaven: if there's one mask, then whole spine goes to masked renderer, to make sure that there are minimal shader switches.

https://github.com/pixijs/pixi-heaven/blob/eb554499afe3fcbb42bb4d4f77edb2ee0c27b7fa/src/spine/SpineH.ts#L42

However, nobody used that for long time, and after conversions between 4 to 5, 5.1 and 5.2, and 5 to 6 , i didnt test it.

However, in your case, you are trying to apply a mask to Mesh, and that just wasnt implemented, because there's no calculateMaskVertices() method for it. Yes, its not hard to make, just copy it from sprite implementation and adjust a bit.

Wanna be a hero and do it, and make PR for the plugin?

[GMihalkow]

I guess it wasn't intended to use masks directly on Spine Meshes? How are they intended to be used with spine then? I tried to have them as children of an already masked container (sprite with a set maskSprite). The mask worked on the sprite but didn't apply for any of the mesh children.

[ivanpopelyshev]

I guess it wasn't intended to use masks directly on Spine Meshes?

No one needed that. There's no problem to make such a mask.

Also sprite masks cant possibly work on children, that's a thing that got sacrificed for performance. Batching shader treats it as two textures with two pair of UV attributes, there is serious modification of main batching algorithm , e.t.c.

In short, you want this thing - look how calculateMaskVertices works on sprite, do the same for MeshH, add MeshH.prototype.calculteMaskVertices = .... If you fail I can do it when I have time. If you want it done right now - assign a bounty, 100$ will do. Original sprite mask was made for about 500$