@vpmedia/phaser 1.115.0 → 1.117.0

package/src/phaser/display/webgl/fast_sprite_batch.ts

@@ -1,20 +1,21 @@
+import type { BaseTexture } from './base_texture.js';
 import type { IdentifiedWebGLRenderingContext } from './util.js';
 import type { Image } from '../../display/image.js';
 import type { RenderSession } from '../render_session.js';
 
 export class FastSpriteBatch {
-  public gl!: any;
-  public vertSize: any = 10;
-  public maxSize: any = 6e3;
-  public size!: any;
-  public vertices!: any;
-  public indices!: any;
-  public vertexBuffer!: any;
-  public indexBuffer!: any;
-  public lastIndexCount!: any;
-  public drawing!: any;
-  public currentBatchSize!: any;
-  public currentBaseTexture!: any;
+  public gl!: IdentifiedWebGLRenderingContext;
+  public vertSize = 10;
+  public maxSize = 6e3;
+  public size!: number;
+  public vertices!: Float32Array;
+  public indices!: Uint16Array;
+  public vertexBuffer!: WebGLBuffer | null;
+  public indexBuffer!: WebGLBuffer | null;
+  public lastIndexCount!: number;
+  public drawing!: boolean;
+  public currentBatchSize!: number;
+  public currentBaseTexture!: BaseTexture | null;
   public currentBlendMode!: any;
   public renderSession!: RenderSession;
   public shader!: any;
@@ -56,7 +57,7 @@ export class FastSpriteBatch {
    * Sets the WebGL context for this batch.
    * @param {WebGLRenderingContext & { id: number }} gl - The WebGL rendering context.
    */
-  public setContext(gl: IdentifiedWebGLRenderingContext) {
+  public setContext(gl: IdentifiedWebGLRenderingContext): void {
     this.gl = gl;
     // create a couple of buffers
     this.vertexBuffer = gl.createBuffer();
@@ -74,7 +75,7 @@ export class FastSpriteBatch {
    * @param {object} spriteBatch - The sprite batch to render.
    * @param {object} renderSession - The render session to use.
    */
-  public begin(spriteBatch: any, renderSession: RenderSession) {
+  public begin(spriteBatch: any, renderSession: RenderSession): void {
     this.renderSession = renderSession;
     this.shader = this.renderSession.shaderManager.fastShader;
     this.matrix = spriteBatch.worldTransform.toArray(true);
@@ -84,7 +85,7 @@ export class FastSpriteBatch {
   /**
    * Updates the sprite batch.
    */
-  public end() {
+  public end(): void {
     this.flush();
   }
 
@@ -92,7 +93,7 @@ export class FastSpriteBatch {
    * Flushes the sprite batch to WebGL.
    * @param {object} spriteBatch - The sprite batch to flush.
    */
-  public render(spriteBatch: any) {
+  public render(spriteBatch: any): void {
     const { children } = spriteBatch;
     const sprite = children[0];
     // if the uvs have not updated then no point rendering just yet!
@@ -116,7 +117,7 @@ export class FastSpriteBatch {
    * Renders a sprite using WebGL.
    * @param {Image} sprite - The sprite to render.
    */
-  public renderSprite(sprite: Image) {
+  public renderSprite(sprite: Image): void {
     if (!sprite.visible) {
       return;
     }
@@ -128,7 +129,7 @@ export class FastSpriteBatch {
         return;
       }
     }
-    const uvs = sprite.texture._uvs;
+    const uvs = sprite.texture._uvs!;
     const { vertices } = this;
     // const width = sprite.texture.frame.width;
     // const height = sprite.texture.frame.height;
@@ -222,17 +223,18 @@ export class FastSpriteBatch {
   /**
    * Binds the sprite batch to the WebGL context.
    */
-  public flush() {
+  public flush(): void {
     // If the batch is length 0 then return as there is nothing to draw
     if (this.currentBatchSize === 0) {
       return;
     }
     const { gl } = this;
     // bind the current texture
-    if (!this.currentBaseTexture._glTextures[gl.id]) {
-      this.renderSession.renderer.updateTexture(this.currentBaseTexture);
+    const baseTexture = this.currentBaseTexture!;
+    if (!baseTexture._glTextures[gl.id]) {
+      this.renderSession.renderer.updateTexture(baseTexture);
     }
-    gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]);
+    gl.bindTexture(gl.TEXTURE_2D, baseTexture._glTextures[gl.id] ?? null);
     // upload the verts to the buffer
     if (this.currentBatchSize > this.size * 0.5) {
       gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertices);
@@ -251,14 +253,14 @@ export class FastSpriteBatch {
   /**
    * Renders a sprite using the sprite batch.
    */
-  public stop() {
+  public stop(): void {
     this.flush();
   }
 
   /**
    * Sets up the sprite batch for WebGL rendering.
    */
-  public start() {
+  public start(): void {
     const { gl } = this;
     // bind the main texture
     gl.activeTexture(gl.TEXTURE0);

package/src/phaser/display/webgl/filter_manager.ts

@@ -17,7 +17,7 @@ export class WebGLFilterManager {
    * Initializes the filter manager with a WebGL context.
    * @param {WebGLRenderingContext} gl - The WebGL rendering context.
    */
-  public setContext(gl: WebGLRenderingContext) {
+  public setContext(gl: WebGLRenderingContext): void {
     this.gl = gl;
     this.texturePool = [];
     this.initShaderBuffers();
@@ -26,42 +26,42 @@ export class WebGLFilterManager {
   /**
    * Applies a filter to the specified texture.
    */
-  public begin() {
+  public begin(): void {
     // TODO
   }
 
   /**
    * Updates the filter texture for the specified size.
    */
-  public pushFilter(_filterBlock: object | null) {
+  public pushFilter(_filterBlock: object | null): void {
     // TODO
   }
 
   /**
    * Resizes the filter manager to the specified dimensions.
    */
-  public popFilter() {
+  public popFilter(): void {
     // TODO
   }
 
   /**
    * Destroys this filter manager and cleans up resources.
    */
-  public applyFilterPass() {
+  public applyFilterPass(): void {
     // TODO
   }
 
   /**
    * Initializes the filter manager.
    */
-  public initShaderBuffers() {
+  public initShaderBuffers(): void {
     // TODO
   }
 
   /**
    * Sets up the filter manager for WebGL rendering.
    */
-  public destroy() {
+  public destroy(): void {
     // TODO
   }
 }

package/src/phaser/display/webgl/filter_texture.ts

@@ -37,7 +37,7 @@ export class FilterTexture {
   /**
    * Destroys this filter texture and cleans up resources.
    */
-  public clear() {
+  public clear(): void {
     const { gl } = this;
     gl.clearColor(0, 0, 0, 0);
     gl.clear(gl.COLOR_BUFFER_BIT);
@@ -48,7 +48,7 @@ export class FilterTexture {
    * @param {number} width - The new width of the filter texture.
    * @param {number} height - The new height of the filter texture.
    */
-  public resize(width: number, height: number) {
+  public resize(width: number, height: number): void {
     if (this.width === width && this.height === height) {
       return;
     }
@@ -65,7 +65,7 @@ export class FilterTexture {
   /**
    * Updates the resolution of this filter texture.
    */
-  public destroy() {
+  public destroy(): void {
     const { gl } = this;
     gl.deleteFramebuffer(this.frameBuffer);
     gl.deleteTexture(this.texture);

package/src/phaser/display/webgl/graphics.ts

@@ -1,3 +1,5 @@
+import type { GraphicsData as DisplayGraphicsData } from '../graphics_data.js';
+import type { GraphicsWebGLBucket } from '../graphics.js';
 import { Point } from '../../geom/point.js';
 import { hex2rgb } from '../../util/math.js';
 import { triangulate } from './earcut.js';
@@ -15,7 +17,7 @@ import { RoundedRectangle } from '../../geom/rounded_rectangle.js';
  * Updates the graphics data for WebGL rendering.
  * @returns {number} The number of vertices in the graphics data.
  */
-export const getStencilBufferLimit = () => {
+export const getStencilBufferLimit = (): number => {
   globalThis.PhaserRegistry.stencilBufferLimit ??= 6;
   return globalThis.PhaserRegistry.stencilBufferLimit;
 };
@@ -35,14 +37,14 @@ export const getGraphicsDataPool = () => {
  * @param {number} type - The type of graphics data to create.
  * @returns {object} The newly created graphics data object.
  */
-export const switchMode = (webGL: any, type: number) => {
+export const switchMode = (webGL: GraphicsWebGLBucket, type: number) => {
   let webGLData;
   if (webGL.data.length === 0) {
     webGLData = getGraphicsDataPool().pop() ?? new GraphicsData(webGL.gl);
     webGLData.mode = type;
     webGL.data.push(webGLData);
   } else {
-    webGLData = webGL.data.at(-1);
+    webGLData = webGL.data.at(-1)!;
     if (webGLData.mode !== type || type === 1) {
       webGLData = getGraphicsDataPool().pop() ?? new GraphicsData(webGL.gl);
       webGLData.mode = type;
@@ -58,7 +60,7 @@ export const switchMode = (webGL: any, type: number) => {
  * @param {object} graphicsData - The graphics data to update.
  * @param {GraphicsData} webGLData - The WebGL graphics data object.
  */
-export const buildLine = (graphicsData: any, webGLData: GraphicsData) => {
+export const buildLine = (graphicsData: DisplayGraphicsData, webGLData: GraphicsData): void => {
   // TODO OPTIMISE!
   let i = 0;
   let { points } = graphicsData;
@@ -68,7 +70,7 @@ export const buildLine = (graphicsData: any, webGLData: GraphicsData) => {
   // if the line width is an odd number add 0.5 to align to a whole pixel
   if (graphicsData.lineWidth % 2) {
     for (i = 0; i < points.length; i += 1) {
-      points[i] += 0.5;
+      points[i]! += 0.5;
     }
   }
   // get first and last point.. figure out the middle!
@@ -122,10 +124,10 @@ export const buildLine = (graphicsData: any, webGLData: GraphicsData) => {
   let denom;
   let pdist;
   let dist;
-  p1x = points[0];
-  p1y = points[1];
-  p2x = points[2];
-  p2y = points[3];
+  p1x = points[0]!;
+  p1y = points[1]!;
+  p2x = points[2]!;
+  p2y = points[3]!;
   perpx = -(p1y - p2y);
   perpy = p1x - p2x;
   dist = Math.sqrt(perpx * perpx + perpy * perpy);
@@ -137,12 +139,12 @@ export const buildLine = (graphicsData: any, webGLData: GraphicsData) => {
   verts.push(p1x - perpx, p1y - perpy, r, g, b, alpha);
   verts.push(p1x + perpx, p1y + perpy, r, g, b, alpha);
   for (i = 1; i < length - 1; i += 1) {
-    p1x = points[(i - 1) * 2];
-    p1y = points[(i - 1) * 2 + 1];
-    p2x = points[i * 2];
-    p2y = points[i * 2 + 1];
-    p3x = points[(i + 1) * 2];
-    p3y = points[(i + 1) * 2 + 1];
+    p1x = points[(i - 1) * 2]!;
+    p1y = points[(i - 1) * 2 + 1]!;
+    p2x = points[i * 2]!;
+    p2y = points[i * 2 + 1]!;
+    p3x = points[(i + 1) * 2]!;
+    p3y = points[(i + 1) * 2 + 1]!;
     perpx = -(p1y - p2y);
     perpy = p1x - p2x;
     dist = Math.sqrt(perpx * perpx + perpy * perpy);
@@ -195,10 +197,10 @@ export const buildLine = (graphicsData: any, webGLData: GraphicsData) => {
       verts.push(r, g, b, alpha);
     }
   }
-  p1x = points[(length - 2) * 2];
-  p1y = points[(length - 2) * 2 + 1];
-  p2x = points[(length - 1) * 2];
-  p2y = points[(length - 1) * 2 + 1];
+  p1x = points[(length - 2) * 2]!;
+  p1y = points[(length - 2) * 2 + 1]!;
+  p2x = points[(length - 1) * 2]!;
+  p2y = points[(length - 1) * 2 + 1]!;
   perpx = -(p1y - p2y);
   perpy = p1x - p2x;
   dist = Math.sqrt(perpx * perpx + perpy * perpy);
@@ -223,18 +225,18 @@ export const buildLine = (graphicsData: any, webGLData: GraphicsData) => {
  * @param {object} graphicsData - The graphics data to update.
  * @param {GraphicsData} webGLData - The WebGL graphics data object.
  */
-export const buildRectangle = (graphicsData: any, webGLData: GraphicsData) => {
+export const buildRectangle = (graphicsData: DisplayGraphicsData, webGLData: GraphicsData): void => {
   //
   // need to convert points to a nice regular data
   //
-  const rectData = graphicsData.shape;
+  const rectData = graphicsData.shape as Rectangle;
   const { x } = rectData;
   const { y } = rectData;
   const { width } = rectData;
   const { height } = rectData;
 
   if (graphicsData.fill) {
-    const color = hex2rgb(graphicsData.fillColor);
+    const color = hex2rgb(graphicsData.fillColor ?? 0);
     const alpha = graphicsData.fillAlpha;
     const r = color[0] * alpha;
     const g = color[1] * alpha;
@@ -279,7 +281,7 @@ export const quadraticBezierCurve = (
   cpY: number,
   toX: number,
   toY: number
-) => {
+): number[] => {
   let xa;
   let ya;
   let xb;
@@ -288,7 +290,7 @@ export const quadraticBezierCurve = (
   let y;
   const n = 20;
   const points = [];
-  const getPt = (n1: number, n2: number, perc: number) => {
+  const getPt = (n1: number, n2: number, perc: number): number => {
     const diff = n2 - n1;
     return n1 + diff * perc;
   };
@@ -313,8 +315,8 @@ export const quadraticBezierCurve = (
  * @param {object} graphicsData - The graphics data to update.
  * @param {GraphicsData} webGLData - The WebGL graphics data object.
  */
-export const buildRoundedRectangle = (graphicsData: any, webGLData: GraphicsData) => {
-  const rrectData = graphicsData.shape;
+export const buildRoundedRectangle = (graphicsData: DisplayGraphicsData, webGLData: GraphicsData): void => {
+  const rrectData = graphicsData.shape as RoundedRectangle;
   const { x } = rrectData;
   const { y } = rrectData;
   const { width } = rrectData;
@@ -329,7 +331,7 @@ export const buildRoundedRectangle = (graphicsData: any, webGLData: GraphicsData
   recPoints = recPoints.concat(quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y));
   recPoints = recPoints.concat(quadraticBezierCurve(x + radius, y, x, y, x, y + radius));
   if (graphicsData.fill) {
-    const color = hex2rgb(graphicsData.fillColor);
+    const color = hex2rgb(graphicsData.fillColor ?? 0);
     const alpha = graphicsData.fillAlpha;
     const r = color[0] * alpha;
     const g = color[1] * alpha;
@@ -347,7 +349,7 @@ export const buildRoundedRectangle = (graphicsData: any, webGLData: GraphicsData
     }
     for (let i = 0; i < recPoints.length; i += 2) {
       // TODO verify
-      verts.push(recPoints[i], recPoints[i + 1], r, g, b, alpha);
+      verts.push(recPoints[i]!, recPoints[i + 1]!, r, g, b, alpha);
     }
   }
   if (graphicsData.lineWidth) {
@@ -363,15 +365,15 @@ export const buildRoundedRectangle = (graphicsData: any, webGLData: GraphicsData
  * @param {object} graphicsData - The graphics data to update.
  * @param {GraphicsData} webGLData - The WebGL graphics data object.
  */
-export const buildCircle = (graphicsData: any, webGLData: GraphicsData) => {
+export const buildCircle = (graphicsData: DisplayGraphicsData, webGLData: GraphicsData): void => {
   // need to convert points to a nice regular data
-  const circleData = graphicsData.shape;
+  const circleData = graphicsData.shape as Circle | Ellipse;
   const { x } = circleData;
   const { y } = circleData;
   let width;
   let height;
   // TODO - bit hacky??
-  if (graphicsData.shape instanceof Circle) {
+  if (circleData instanceof Circle) {
     width = circleData.radius;
     height = circleData.radius;
   } else {
@@ -381,7 +383,7 @@ export const buildCircle = (graphicsData: any, webGLData: GraphicsData) => {
   const totalSegs = 40;
   const seg = (Math.PI * 2) / totalSegs;
   if (graphicsData.fill) {
-    const color = hex2rgb(graphicsData.fillColor);
+    const color = hex2rgb(graphicsData.fillColor ?? 0);
     const alpha = graphicsData.fillAlpha;
     const r = color[0] * alpha;
     const g = color[1] * alpha;
@@ -414,7 +416,7 @@ export const buildCircle = (graphicsData: any, webGLData: GraphicsData) => {
  * @param {object} graphicsData - The graphics data to update.
  * @param {GraphicsData} webGLData - The WebGL graphics data object.
  */
-export const buildComplexPoly = (graphicsData: any, webGLData: GraphicsData) => {
+export const buildComplexPoly = (graphicsData: DisplayGraphicsData, webGLData: GraphicsData): void => {
   // TODO - no need to copy this as it gets turned into a Float32Array anyways..
   const points = [...graphicsData.points];
   if (points.length < 6) {
@@ -424,7 +426,7 @@ export const buildComplexPoly = (graphicsData: any, webGLData: GraphicsData) =>
   const { indices } = webGLData;
   webGLData.points = points;
   webGLData.alpha = graphicsData.fillAlpha;
-  webGLData.color = hex2rgb(graphicsData.fillColor);
+  webGLData.color = hex2rgb(graphicsData.fillColor ?? 0);
   /*
    calculate the bounds..
    */
@@ -436,8 +438,8 @@ export const buildComplexPoly = (graphicsData: any, webGLData: GraphicsData) =>
   let y;
   // get size..
   for (let i = 0; i < points.length; i += 2) {
-    x = points[i];
-    y = points[i + 1];
+    x = points[i]!;
+    y = points[i + 1]!;
     minX = x < minX ? x : minX;
     maxX = x > maxX ? x : maxX;
     minY = y < minY ? y : minY;
@@ -459,7 +461,7 @@ export const buildComplexPoly = (graphicsData: any, webGLData: GraphicsData) =>
  * @param {GraphicsData} webGLData - TBD.
  * @returns {boolean} TBD.
  */
-export const buildPoly = (graphicsData: any, webGLData: GraphicsData) => {
+export const buildPoly = (graphicsData: DisplayGraphicsData, webGLData: GraphicsData): boolean => {
   const { points } = graphicsData;
   if (points.length < 6) {
     return false;
@@ -469,7 +471,7 @@ export const buildPoly = (graphicsData: any, webGLData: GraphicsData) => {
   const { indices } = webGLData;
   const length = points.length / 2;
   // sort color
-  const color = hex2rgb(graphicsData.fillColor);
+  const color = hex2rgb(graphicsData.fillColor ?? 0);
   const alpha = graphicsData.fillAlpha;
   const r = color[0] * alpha;
   const g = color[1] * alpha;
@@ -487,7 +489,7 @@ export const buildPoly = (graphicsData: any, webGLData: GraphicsData) => {
     indices.push(triangles[i + 2]! + vertPos);
   }
   for (let i = 0; i < length; i += 1) {
-    verts.push(points[i * 2], points[i * 2 + 1], r, g, b, alpha);
+    verts.push(points[i * 2]!, points[i * 2 + 1]!, r, g, b, alpha);
   }
   return true;
 };
@@ -497,7 +499,7 @@ export const buildPoly = (graphicsData: any, webGLData: GraphicsData) => {
  * @param {Graphics} graphics - The graphics object to update.
  * @param {WebGLRenderingContext & { id: number }} gl - The WebGL rendering context.
  */
-export const updateGraphics = (graphics: Graphics, gl: IdentifiedWebGLRenderingContext) => {
+export const updateGraphics = (graphics: Graphics, gl: IdentifiedWebGLRenderingContext): void => {
   const stencilBufferLimit = getStencilBufferLimit();
   // get the contexts graphics object
   let webGL = graphics._webGL[gl.id];
@@ -582,7 +584,7 @@ export const updateGraphics = (graphics: Graphics, gl: IdentifiedWebGLRenderingC
  * @param {Graphics} graphics - The graphics object to update.
  * @param {object} renderSession - The rendering session.
  */
-export const renderGraphics = (graphics: Graphics, renderSession: RenderSession) => {
+export const renderGraphics = (graphics: Graphics, renderSession: RenderSession): void => {
   const { gl } = renderSession;
   const { projection } = renderSession;
   const { offset } = renderSession;

package/src/phaser/display/webgl/graphics_data.ts

@@ -30,7 +30,7 @@ export class GraphicsData {
   /**
    * Destroys this graphics data and cleans up resources.
    */
-  public reset() {
+  public reset(): void {
     this.points = [];
     this.indices = [];
     this.glPoints = null;
@@ -40,7 +40,7 @@ export class GraphicsData {
   /**
    * Updates the graphics data for WebGL rendering.
    */
-  public upload() {
+  public upload(): void {
     const { gl } = this;
     // this.lastIndex = graphics.graphicsData.length;
     this.glPoints = new Float32Array(this.points);

package/src/phaser/display/webgl/mask_manager.ts

@@ -6,7 +6,7 @@ import type { RenderSession } from '../render_session.js';
  * @param {object} maskData - The mask data to apply.
  * @param {object} renderSession - The rendering session.
  */
-export const pushMask = (maskData: any, renderSession: RenderSession) => {
+export const pushMask = (maskData: any, renderSession: RenderSession): void => {
   const { gl } = renderSession;
   if (maskData.dirty) {
     updateGraphics(maskData, gl);
@@ -26,7 +26,7 @@ export const pushMask = (maskData: any, renderSession: RenderSession) => {
  * @param {object} maskData - The mask data to apply.
  * @param {object} renderSession - The rendering session.
  */
-export const popMask = (maskData: any, renderSession: RenderSession) => {
+export const popMask = (maskData: any, renderSession: RenderSession): void => {
   const { gl } = renderSession;
   if (
     maskData._webGL[gl.id] === undefined ||

package/src/phaser/display/webgl/render_texture.ts

@@ -71,28 +71,28 @@ export class RenderTexture extends Texture {
   /**
    * Destroys this render texture and cleans up resources.
    */
-  public resize() {
+  public resize(): void {
     // TODO
   }
 
   /**
    * Updates the size of this render texture.
    */
-  public clear() {
+  public clear(): void {
     // TODO
   }
 
   /**
    * Updates the resolution of this render texture.
    */
-  public renderWebGL() {
+  public renderWebGL(): void {
     // TODO
   }
 
   /**
    * Updates the scale mode of this render texture.
    */
-  public renderCanvas() {
+  public renderCanvas(): void {
     // TODO
   }
 
@@ -100,7 +100,7 @@ export class RenderTexture extends Texture {
    * Gets the HTML image element for this render texture.
    * @returns {HTMLImageElement} The HTML image element.
    */
-  public getImage() {
+  public getImage(): HTMLImageElement {
     const image = new Image();
     image.src = this.getBase64();
     return image;
@@ -110,7 +110,7 @@ export class RenderTexture extends Texture {
    * Gets the base64 string representation of this render texture.
    * @returns {string} The base64 string representation.
    */
-  public getBase64() {
+  public getBase64(): string {
     return this.getCanvas()?.toDataURL() ?? '';
   }
 

package/src/phaser/display/webgl/renderer.ts

@@ -39,19 +39,19 @@ import type { RenderSession } from '../render_session.js';
 export class WebGLRenderer {
   public gl!: IdentifiedWebGLRenderingContext;
   public glContextId!: number;
-  public type!: any;
+  public type!: number;
   public resolution!: number;
-  public autoResize!: any;
-  public contextLost!: any;
-  public clearBeforeRender!: any;
+  public autoResize!: boolean;
+  public contextLost!: boolean;
+  public clearBeforeRender!: boolean;
   public width!: number;
   public height!: number;
-  public view!: any;
-  public _contextOptions!: any;
-  public projection!: any;
-  public offset!: any;
-  public shaderManager!: any;
-  public spriteBatch!: any;
+  public view!: HTMLCanvasElement;
+  public _contextOptions!: WebGLContextAttributes;
+  public projection!: Point;
+  public offset!: Point;
+  public shaderManager!: WebGLShaderManager;
+  public spriteBatch!: WebGLSpriteBatch;
   public filterManager!: any;
   public stencilManager!: any;
   public blendModeManager!: any;
@@ -105,16 +105,11 @@ export class WebGLRenderer {
   /**
    * Destroys this renderer and cleans up resources.
    */
-  public destroy() {
+  public destroy(): void {
     globalThis.PhaserRegistry.GL_CONTEXTS[this.glContextId] = null;
-    this.projection = null;
-    this.offset = null;
     this.shaderManager.destroy();
     this.spriteBatch.destroy();
     this.filterManager.destroy();
-    this.shaderManager = null;
-    this.spriteBatch = null;
-    this.filterManager = null;
     if (this.gl) {
       this.gl.canvas.width = 1;
       this.gl.canvas.height = 1;
@@ -131,7 +126,7 @@ export class WebGLRenderer {
   /**
    * Initializes the WebGL registry.
    */
-  public initRegistry() {
+  public initRegistry(): void {
     globalThis.PhaserRegistry.GL_CONTEXT_ID ??= 0;
     globalThis.PhaserRegistry.GL_CONTEXTS ??= [];
     globalThis.PhaserRegistry.INSTANCES ??= [];
@@ -142,7 +137,7 @@ export class WebGLRenderer {
    * @param {Game} game - The game instance.
    * @throws {Error}
    */
-  public initContext(game: Game) {
+  public initContext(game: Game): void {
     game.logger.info('initContext');
     // TODO: view.addEventListener('webglcontextcreationerror', this.onWebGLContextCreationError, false);
     /** @type {WebGLRenderingContext & { id: number }} */
@@ -185,7 +180,7 @@ export class WebGLRenderer {
    * Renders the stage to WebGL.
    * @param {Stage} stage - The root stage to render.
    */
-  public render(stage: Stage) {
+  public render(stage: Stage): void {
     if (this.contextLost) {
       return;
     }
@@ -210,7 +205,7 @@ export class WebGLRenderer {
    * @param {object} buffer - The render buffer.
    * @param {Matrix} matrix - The transformation matrix.
    */
-  public renderDisplayObject(displayObject: any, projection: Point, buffer?: any, matrix?: any) {
+  public renderDisplayObject(displayObject: any, projection: Point, buffer?: any, matrix?: any): void {
     this.renderSession.blendModeManager.setBlendMode(BLEND_NORMAL);
     // reset the render session data..
     this.renderSession.drawCount = 0;
@@ -235,7 +230,7 @@ export class WebGLRenderer {
    * @param {number} width - The new width of the canvas.
    * @param {number} height - The new height of the canvas.
    */
-  public resize(width: number, height: number) {
+  public resize(width: number, height: number): void {
     this.width = width * this.resolution;
     this.height = height * this.resolution;
     this.view.width = this.width;
@@ -254,15 +249,15 @@ export class WebGLRenderer {
    * @param {BaseTexture} texture - The base texture to update.
    * @returns {boolean} Whether the update was successful.
    */
-  public updateTexture(texture: BaseTexture) {
+  public updateTexture(texture: BaseTexture): boolean {
     if (!texture.hasLoaded) {
       return false;
     }
     const { gl } = this;
     texture._glTextures[gl.id] ??= gl.createTexture();
-    gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]);
+    gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id] ?? null);
     gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, texture.premultipliedAlpha);
-    gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.source);
+    gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.source!);
     gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, texture.scaleMode === SCALE_LINEAR ? gl.LINEAR : gl.NEAREST);
     if (texture.mipmap && isPowerOfTwo(texture.width, texture.height)) {
       gl.texParameteri(
@@ -293,7 +288,7 @@ export class WebGLRenderer {
   /**
    * Maps blend modes to WebGL rendering operations.
    */
-  public mapBlendModes() {
+  public mapBlendModes(): void {
     if (globalThis.PhaserRegistry.blendModesWebGL) {
       return;
     }