Skip to content

Memory Leak when using MobilePipeline and SpinePlugin #7193

@dhashvir

Description

@dhashvir

Version

  • Phaser Version: 3.90
  • Operating system: All
  • Browser: All Mobile

Description

I have found a memory leak when using the MobilePipeline on webgl renderer. The default MultiPipeline works fine and has no memory leaks.

I happens as soon as you have a spine game object and any other game object. It will cause the render game.renderer.glAttribLocationWrappers to infinitely grow on very update.

Example Test Code

import Phaser from 'phaser';
import { SpinePlugin } from '@esotericsoftware/spine-phaser-v3';

class Example extends Phaser.Scene {
  preload() {
    this.load.atlas('buttons', 'nine-slice.png', 'nine-slice.json');
    this.load.spineJson('spineboy-json', 'spine/spineboy-pro.json');
    this.load.spineAtlas('spineboy-atlas', 'spine/spineboy-pma.atlas', false);
  }

  create() {
    // Need to have another game object
    var button = this.add.nineslice(400, 300, 'buttons', 'button-bg', 400, 110, 64, 64);
    button.setInteractive();
    button.on('pointerup', this.onButtonPressed, this);
    button.input.cursor = 'pointer';
    button.setSize(100, 50);

    const spineBoy = this.add.spine(500, 500, 'spineboy-json', 'spineboy-atlas');
    spineBoy.animationState.setAnimation(0, 'idle', true);
  }

  onButtonPressed() {
    console.log('button pressed');
  }

  update() {
    console.log('glAttribLocationWrappers', this.game.renderer.glAttribLocationWrappers.length);
  }
}

const config = {
  type: Phaser.WEBGL,
  width: 800,
  height: 600,
  backgroundColor: '#000000',
  parent: 'phaser-example',
  scene: Example,
  render: {
    autoMobilePipeline: false, // Disable mobile pipeline to force default
    defaultPipeline: 'MobilePipeline'  // Comment this out to use default 'MultiPipeline'
  },
  plugins: {
    scene: [{ key: 'spine.SpinePlugin', plugin: SpinePlugin, mapping: 'spine' }]
  }
};

const game = new Phaser.Game(config);

Additional Information

I have the console logging, to see it increase in the Mobile Pipeline and it won't in the default one.

From my investigation. I have found that the Mobile-vert,js shader has an unused attribute inTexId, and it is gettting compiled out and then in the WebGLRenderer.js createAttribLocation function its tries to create the wrapper but it cannot get a location which keeps adding to the glAttriLocationWrappers array and never removes it.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions