Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Shader.preDestroy leaks its ShaderQuad's vertex buffer and VAO on every create/destroy cycle (4.2.1)

オープン 初心者向け
  • 何か問題がありますか？
#7,394 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 2 日以内に返信

@k1epg01ng129-eng がすでに取り組んでいます。

2026年10月14日 から。

  • #7399 @k1epg01ng129-eng による — オープン

評価

難易度
2/5
見積もり時間
1〜3時間
初心者へのやさしさ
86/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
javascript
領域
game-dev

調査の方向性

Shader ゲームオブジェクトのソース (src/gameobjects/Shader/Shader.js) にある preDestroy から始め、renderNode を ShaderQuad、その WebGLVertexBufferLayoutWrapper、ProgramManager まで追跡してください。WebGLRenderer がラッパーを登録・解放する方法（glBufferWrappers、glVAOWrappers、deleteBuffer）を読み、VAO に対して同じパターンを踏襲する（場合によっては deleteVAO を追加する）必要があります。issue の HTML プローブが両方のカウントについて 0, 0, 0, 0 を出力し、初回描画前に破棄した場合を含み、共有プログラムや genericQuadIndexBuffer を解放しなくなった時点で完了です。

索引モデルが issue の本文から書いたものです。

説明

In WebGL mode, every Shader game object builds its own ShaderQuad render node. The node allocates a vertex buffer

(WebGLVertexBufferLayoutWrapper → renderer.createVertexBuffer, registered in renderer.glBufferWrappers).

On first draw, its ProgramManager creates a VAO per linked program

(renderer.createVAO, registered in renderer.glVAOWrappers).

Shader.preDestroy only nulls this.renderNode. Neither the vertex buffer nor the VAO is released, so both stay registered with the renderer, and their GL objects stay allocated, for the life of the game.

This adds up quickly when shaders are created and destroyed repeatedly. For example, a UI button that draws its background with a Shader and lives in an overlay that is rebuilt on every show leaks one buffer and one VAO per button per show.

Expected: after each create/draw/destroy cycle, the buffer and VAO wrapper counts return to their baseline.

Actual: both counts grow by one per cycle. A shader destroyed before its first draw still leaks its vertex buffer.

Example Test Code

Run against unpatched Phaser 4.2.1:

<!doctype html>
<html>
<body>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/phaser.js"></script>
<script>
const config = {
    name: 'LeakProbe',
    fragmentSource: `
        precision mediump float;
        varying vec2 outTexCoord;
        void main() { gl_FragColor = vec4(outTexCoord, 0.0, 1.0); }
    `
};

new Phaser.Game({
    type: Phaser.WEBGL,
    width: 128,
    height: 128,
    audio: { noAudio: true },
    scene: {
        create: function () {
            const renderer = this.game.renderer;
            let baseBuffers = null;
            let baseVAOs = null;
            let shader = null;
            let cycle = 0;

            // Each cycle: create a Shader, let it draw once (which creates its VAO), then destroy it.
            this.game.events.on('postrender', () => {
                if (baseBuffers === null) {
                    baseBuffers = renderer.glBufferWrappers.length;
                    baseVAOs = renderer.glVAOWrappers.length;
                } else if (shader) {
                    shader.destroy();
                    shader = null;
                    cycle++;
                    console.log(
                        `Cycle ${cycle}: retained buffers = ${renderer.glBufferWrappers.length - baseBuffers},`,
                        `retained VAOs = ${renderer.glVAOWrappers.length - baseVAOs}`
                    );
                }

                if (cycle < 4) {
                    shader = this.add.existing(new Phaser.GameObjects.Shader(this, config, 64, 64, 64, 64));
                }
            });
        }
    }
});
</script>
</body>
</html>

Expected counts: 0, 0, 0, 0 for both.
Actual counts: 1, 2, 3, 4 for both.

Additional Information

Releasing the render node's own resources in Shader.preDestroy eliminates the growth:

preDestroy: function ()
{
    var renderNode = this.renderNode;

    if (renderNode)
    {
        //  Release this Shader's own GL resources. The program and the
        //  index buffer are shared, so they stay.
        var renderer = renderNode.renderer;
        var programs = renderNode.programManager.programs;

        for (var key in programs)
        {
            var vao = programs[key].vao;
            var vaoIndex = renderer.glVAOWrappers.indexOf(vao);

            if (vaoIndex !== -1)
            {
                renderer.glVAOWrappers.splice(vaoIndex, 1);
            }

            vao.destroy();
        }

        renderer.deleteBuffer(renderNode.vertexBufferLayout.buffer);
    }

    this.renderNode = null;

    // ... existing preDestroy body unchanged
}

The shader program is shared through ShaderProgramFactory's key cache, and the index buffer is the renderer's shared genericQuadIndexBuffer, so neither should be deleted here. WebGLRenderer has no VAO counterpart to deleteBuffer, which is why the fix removes the VAO from glVAOWrappers directly. A deleteVAO method on the renderer might be the cleaner upstream shape.

The same leak affects any ShaderQuad-based object that is destroyed; Shader is just the most direct way to reproduce it. The master branch's Shader.preDestroy is unchanged from 4.2.1.

主要言語
JavaScript
スター
40.5k
フォーク
7.2k
30日以内にマージされた PR はありません

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

phaserjs/phaser のほかの issue

phaserjs/phaser の issue をすべて見る

似ている issue

JavaScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。