Phaser .js memory leak. how properly release objects within Phaser Canvas app?

We have a game running Phaser .JS. Whilie using browsers, seems that the memory keeps growing.

What is the proper method cleaning the objects?

Answer

I will condense my answer to make it usable.

Phaser 2 claims that most objects can be simply dereferenced by assigning null to their references and this should trigger garbage collection.

Instead others, like TilemapLayers, will explicitly need specific their destructors to be invoked.

Others like Particle can be optionally destroyed (e.g. Particle.kill()).

However as you have found out, the automatic garbage collector isn’t always good and especially if you keep the browser open for a long time, it leaks memory.

So you should kill, stop, remove and destroy everything, even optional objects. Even if you don’t find a specific destructor, most objects inherit from PIXI.DisplayObject and therefore implement .RemoveChild and variants. Especially the parent Phaser.Stage

Go here: https://phaser.io/learn/chains

Search these: destroy removeAll .stage.remove (and remove with all its prefixes and suffixes including removeChild and variants) stop kill.

If you don’t find a specific destructor, remember the PIXI.DisplayObject inheritance and removeChild/ren.

Also remember to invoke Stage.removeStageReference() when you quit.

I hope that helps