Hello,
I recently noticed every 10 sec my PIXI canvas is freezing 0.2 second, and I don’t have any clue why.
CONTEXT
dependencies
"@types/pixi.js": "^5.0.0" "pixi.js": "^5.3.9", "preact": "^10.4.8",
PIXI.JS canvas is contained in PREACT component
I refresh the canvas this way
private GameLoop(): void { if (this._stop) { return; } this._updater.Update(); requestAnimationFrame(() => this.GameLoop()); }
the updater contains 200 items which have more or less 3 sprites each, the updater iterates items in order to update the position of each sprite.
public Update(): void {
if (!GameSettings.IsPause) {
this.Items = this.Items.filter((item) => item.IsUpdatable);
this.Items.forEach((item) => {
item.Update(this.ViewContext.GetX(), this.ViewContext.GetY());
});
}
}
available environment:
I add some logs to know how much time it took for the updater to iterate all items.
[ALL] 12 ms
main.js:679 -> Cn 1 ms
main.js:679 -> Pi 1 ms
main.js:679 -> hn 1 ms
main.js:679 -> hi 0 ms
I haven't noticed anything in chromium profiler, There is no heavy calculation, the script in this environment only handles the display (no IA whatsoever). I have used PREACT for a while and I don't think these freezing are due to it.
Thank you very much for your helps