poncle Posted October 26, 2016 Share Posted October 26, 2016 Steps to reproduce: - Force Phaser to CANVAS - Display a tinted bitmapText string - Clear game cache, purge glyphs, and remove any reference to that bitmapText - See in a debugger how 1 instance of HTMLCanvasElement and 1 of CanvasRenderingContext2D remains allocated in memory for each character the string was made of (a 100 characters string will produce 100 istances of each) I'm using tinted text extensively in my game, so I'm trying to fix the issue in Phaser, but still can't track down and destroy those rogue canvases. Any hint on how to do a temporary fix would be much appreciated! Here's a code snippet in Typescript: module TestModule { export class Game extends Phaser.Game { constructor() { super(800, 600, Phaser.CANVAS, 'content', null); this.state.add('BitmapTextLevel', BitmapTextLevel, true); } } export class BitmapTextLevel extends Phaser.State { text : Phaser.BitmapText; firstUpdate : boolean = false; preload() { this.game.load.baseURL = 'http://examples.phaser.io/assets/'; this.game.load.crossOrigin = 'anonymous'; this.game.load.bitmapFont('desyrel', 'fonts/bitmapFonts/desyrel.png', 'fonts/bitmapFonts/desyrel.xml'); } update() { if (!this.firstUpdate) { this.text = this.game.add.bitmapText(0, 100, "desyrel", "***.***.***.***.*40*.***.***.***.***.***"); this.text.tint = 1000000; this.time.events.loop(1000, this.changeTint, this); this.time.events.add(10000, this.clearCache, this); this.firstUpdate = true; } } changeTint() { if (this.text) { this.text.tint = this.game.rnd.integerInRange(100000, 1000000); } } clearCache() { this.text.purgeGlyphs(); this.text.destroy(); this.game.cache.destroy(); this.text = null; } } } Link to comment Share on other sites More sharing options...
poncle Posted October 26, 2016 Author Share Posted October 26, 2016 Apparently it's just the Pixi CanvasPool that grows according to the number of characters that have to be rendered at once. If it becomes a problem (and it was for me with 1200 characters that were used in one state only) clearing the pool manually when necessary works just fine: while(PIXI.CanvasPool.pool.length > 0) { let elem = PIXI.CanvasPool.pool.pop(); elem.parentNode = null; elem = null; } Link to comment Share on other sites More sharing options...
Recommended Posts