graphicsDevice.resizeCanvas causing black flashes

Anyone else come across the issue with graphicsDevice.resizeCanvas causing the canvas to flash black? Any way to mitigate? Even with autoRender off and not pushing any frames, I still seem to get it.

It looks like graphicsDevice.resizeCanvas() fires the resizecanvas event which calls a bunch of hooks, which result in a new frame getting pushed before the graphics device is ready (causes black screen).

I was able to circumvent this issue by replacing the resizeCanvas() function call with the code from that function without the call. I then delayed by ~100ms to avoid that rendering a black screen.

End result looks like this:

      // Tell PlayCanvas new dimensions
      //, h);
      let gd =;
      let ratio = Math.min(gd.maxPixelRatio, window.devicePixelRatio);
      w *= ratio;
      h *= ratio;
      if (gd.canvas.width === w && gd.canvas.height === w)
      gd.canvas.width = w;
      gd.canvas.height = h;
      // Push new frame (after delay or you get a black screen flash)
      setTimeout(() => {'resizecanvas', w, h); = true;
      }, 150)

Engine function:

1 Like

Hi @Chris,

It’s good that you found a work around, and thanks for sharing it.

I’ve seen this issue sometimes when post process effects are enabled, usually some ordering issue on how they push their passes.

1 Like