BulgePinchFilter makes rendering stutter and constantly move around the screen

[Friksel]

Using the BulgePinchFilter (@pixi/filter-bulge-pinch) on a container with children causes everything inside that container to constantly move around / glitch (while it should stay still) and stutter.
It looks like there is a timing synchronisation issue between Pixi's Stage (which is also a container in this case) and the filtered container.

According to the README of this repo (pixi-filters) the filter should be compatible with PixiJs v5, AFAIK it doesn't mention anything about PixiJs v6. But I can't find a newer version of the filters, so my guess was these filters should still be compatible with v6.
But is it?

[edit] When testing the same with the @pixi/filter-advanced-bloom filter this issue isn't there. But that filter also has issues while rendering; that one is constantly shaking in a high frequency. Not sure what's going on here.
The CRTFilter also has synchronisation issues and moves around contstantly.

AFAIK I do everything exactly as the documentation states.

Used versions
"@pixi/filter-bulge-pinch": "4.1.5",
"pixi.js": "6.2.0"

[Friksel]

Damn, hit the wrong button by accident. This issue shouldn't be closed as it's not solved...

[bigtimebuddy]

Could you please provide a reproduction of this?

[Friksel]

@bigtimebuddy Thanks for re-opening.
I'm sorry. I am not allowed to share code and it's a complete intelligent module with animations so it's not realistic to rebuild everything just for a test and would take too much time which I don't have at the moment. Without the animations the issue isn't there would be my guess.

I can tell you what I believe is causing this issue though:
The container the filter is used on is animating particles that go from a NEGATIVE position and the container always varies in size as these particles can be everywhere. Perhaps filters cannot handle the fact that the start position of the container varies from negative to positive while particles go on and off?

I now switched to using the pinch-filter only on a pixi-spine object and that doesn't seem to have these issues. At least it seems to work fine for a while now.

The issue could also be caused by the fact that the container holds three layers of particles AND an animating spine-layer. It's not needing much performance at all, but it might cause issues with the filter still as it's a combined container not syncing well?

[bigtimebuddy]

Could you create a minimal production of your issue using codepen, jsfiddle, etc? You can use files to recreate the issue you're experiencing.

https://pixijs.download/dev/pixi.min.js
https://filters.pixijs.download/main/filters/filter-bulge-pinch.js

[Friksel]

@bigtimebuddy please re-read my last post

[bigtimebuddy]

Yes, I read it. If you cannot provide a minimal reproduction, I'm sorry but there's nothing to fix. I'm not going to guess or try to reproduce your issue for you. There's no stack trace, screenshot or code provided. Everything is a guess.

It sounds like your situation is complex that involves particles, spine and filters. My suggestion is you narrow your issue by disabling elements until you can zero in on the source of the bug. Then recreate something that contains only the minimal setup. That's the best way to get your issue addressed.

[Friksel]

Yes, I read it. If you cannot provide a minimal reproduction, I'm sorry but there's nothing to fix. I'm not going to guess or try to reproduce your issue for you.

That's unfortunate. Sorry, I don't have the time to recreate a project and debug the pixi filters

[bigtimebuddy]

No worries. If you do have time to dig further, please feel free to update this issue or file a new one.