phaserjs / phaserjs/phaser

v4.2.1 WebGL: sprite batch corruption when an angle tween runs on a GameObject whose position is also written every frame

Open
#7,341 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
JavaScript
Stars
40.3k
Forks
7.2k
PR merge metrics
No merged PRs in 30d

Description

Version

  • Phaser 4.2.1 ("Giedi"), WebGL renderer (type: AUTO)
  • Observed on Linux, Chromium 149 (Playwright headless shell) — also reproduced through several independent scene setups in the same environment. Not yet verified in headed browsers.

Description

When a GameObject has a continuous angle tween running while its position is written imperatively every frame (in scene.update()), sprites in the scene render with corrupted geometry: wedge-shaped chunks missing, or the quad drawn as displaced slices — it looks like one vertex/triangle of the sprite's quad (or its UVs) is wrong for a frame.

Either behavior alone renders perfectly. The combination corrupts.

Reproduction matrix (all with 152×136 PNG textures)

angle position result
static (0° or any fixed angle) written every frame in update() ✅ renders fine
tweened (yoyo/repeat: -1) static ✅ renders fine
tweened written every frame ❌ corrupted (wedges/slices)

The corruption also reproduces when the moving object is a Container and the angle tween targets a child Image (container position written per frame, child angle tweened).

Minimal repro sketch

class Repro extends Phaser.Scene {
    create() {
        this.img = this.add.image(400, 300, 'anyTexture');
        this.tweens.add({
            targets: this.img,
            angle: { from: -4, to: 4 },
            duration: 1500,
            yoyo: true,
            repeat: -1,
        });
    }
    update(time, delta) {
        this.img.x += 20 * (delta / 1000);   // any imperative per-frame movement
        if (this.img.x > 900) this.img.x = 100;
    }
}

With the tween removed (or replaced by a scale/y tween), rendering is clean. With movement removed, rendering is clean.

Workaround

Express "float/wobble" effects on moving objects with scale or child-y tweens instead of angle tweens, or keep rotation static while moving. That fully avoids the artifacts.

Happy to provide screenshots of the corrupted frames or a fuller runnable repro if useful.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the minimal Repro scene, focusing on the tween setup and the imperative position write in scene.update(). Reproduce under Phaser 4.2.1 with the WebGL renderer and compare the angle-plus-movement case with the control cases in the reproduction matrix, including the Container/child Image variant. Done means moving sprites render without wedges, displaced slices, or other geometry corruption while the angle tween runs.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
computer-graphics, game-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.