pixi.js内存泄露问题解决方案

最新推荐文章于 2023-06-29 00:26:26 发布

downinn

最新推荐文章于 2023-06-29 00:26:26 发布

阅读量2.1k

点赞数 6

分类专栏：前端js 文章标签：前端

本文链接：https://blog.csdn.net/downinn/article/details/114648335

版权

前端js 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

pixi.js中，向容器添加几何图形：

public AddChild(): void {
    let rect: PIXI.Graphics = new PIXI.Graphics();
    rect.drawRect(0, 0, 500, 500);
    this.container.addChild(rect);
}

而要在容器移除图形时，我们一般这样做：

public RemoveChild(): void {
    this.container.removeChildren(0,this.container.children.length);
}

但是单纯的移除容器里面的孩子不销毁它就有可能会发生内存泄露，所以在项目中调用removeChildren方法时，推荐把移除的孩子也销毁。销毁它很简单，只需要给移除的孩子也调用destroy方法即可：

public RemoveChild(): void {
    let removedChilds: PIXI.DisplayObject[] = this.container.removeChildren(0,this.container.children.length);
    removedChilds.forEach((c: PIXI.DisplayObject) => {
      c.destroy({
        children: true,
        texture: false,
        baseTexture: false,
      });
    });
}