refactor(textures): replace defrag system with a slot reuse system (#650)

The defrag system was introduced to avoid endlessly growing the
`this.loadedTextures` however this introduced:
* Additional function calls
* Idle processing
* Potential race conditions when the defrag ran inbetween operations
(like 1 frame idle)

Having a memory allocation with potentially lots of `null` items isn't
going to affect memory usage much. Since we want low-latency, zero-copy,
texture memory placement this PR replaces the defrag system with a Slot
Reuse system.

It simply does:
* On texture delete, `null` the place in the texture array
* On texture creation, pick a previously `null` spot or `append` if
there are none

This avoids potential race conditions and the extra overhead of a
defragmentation system while keeping the textures neatly packed at the
beginning.

The only downside is the `this.loadedTextures` array never shrinks, but
this is deemed neglible because it will be just `null` entries and only
be as large as the largest scene supported while rendering in L3. Which
is a tradeoff against zero copy low latency texture memory allocation.

Author: wouterlucas

src/core/TextureMemoryManager.ts

@@ -122,7 +122,6 @@ export class TextureMemoryManager {
   private debugLogging: boolean;
   private lastCleanupTime = 0;
   private baselineMemoryAllocation: number;
-  private needsDefrag = false;
 
   public criticalCleanupRequested = false;
   public doNotExceedCriticalThreshold: boolean;
@@ -191,11 +190,10 @@ export class TextureMemoryManager {
     this.memUsed -= texture.memUsed;
 
     if (byteSize === 0) {
-      // PERFORMANCE: Mark for deletion instead of splice (zero overhead)
+      // PERFORMANCE: Mark for deletion, slot will be reused later
       const index = this.loadedTextures.indexOf(texture);
       if (index !== -1) {
         this.loadedTextures[index] = null;
-        this.needsDefrag = true;
       }
       texture.memUsed = 0;
       return;
@@ -204,7 +202,13 @@ export class TextureMemoryManager {
       texture.memUsed = byteSize;
       this.memUsed += byteSize;
       if (this.loadedTextures.indexOf(texture) === -1) {
-        this.loadedTextures.push(texture);
+        // PERFORMANCE: Reuse empty slots before appending
+        const emptyIndex = this.loadedTextures.indexOf(null);
+        if (emptyIndex !== -1) {
+          this.loadedTextures[emptyIndex] = texture;
+        } else {
+          this.loadedTextures.push(texture);
+        }
       }
     }
 
@@ -225,19 +229,6 @@ export class TextureMemoryManager {
     return this.memUsed > this.criticalThreshold;
   }
 
-  /**
-   * Check if defragmentation is needed
-   *
-   * @remarks
-   * Returns true if the loadedTextures array has null entries that need
-   * to be compacted. Called by platform during idle periods.
-   *
-   * @returns true if defragmentation should be performed
-   */
-  checkDefrag() {
-    return this.needsDefrag;
-  }
-
   /**
    * Destroy a texture and null out its array position
    *
@@ -250,11 +241,10 @@ export class TextureMemoryManager {
       );
     }
 
-    // PERFORMANCE: Null out array position instead of splice (zero overhead)
+    // PERFORMANCE: Null out array position, slot will be reused later
     const index = this.loadedTextures.indexOf(texture);
     if (index !== -1) {
       this.loadedTextures[index] = null;
-      this.needsDefrag = true;
     }
 
     // Destroy texture and update memory counters
@@ -334,37 +324,6 @@ export class TextureMemoryManager {
     }
   }
 
-  /**
-   * Defragment the loadedTextures array by removing null entries
-   *
-   * @remarks
-   * This should be called during idle periods to compact the array
-   * after null-marking deletions. Zero overhead during critical cleanup.
-   */
-  defragment() {
-    if (!this.needsDefrag) {
-      return;
-    }
-
-    // PERFORMANCE: Single-pass compaction
-    let writeIndex = 0;
-    for (
-      let readIndex = 0;
-      readIndex < this.loadedTextures.length;
-      readIndex++
-    ) {
-      const texture = this.loadedTextures[readIndex];
-      if (texture !== null && texture !== undefined) {
-        this.loadedTextures[writeIndex] = texture;
-        writeIndex++;
-      }
-    }
-
-    // Trim array to new size
-    this.loadedTextures.length = writeIndex;
-    this.needsDefrag = false;
-  }
-
   /**
    * Get the current texture memory usage information
    *

src/core/platform.ts

@@ -66,10 +66,6 @@ export const startLoop = (stage: Stage) => {
         stage.txMemManager.cleanup();
       }
 
-      if (stage.txMemManager.checkDefrag() === true) {
-        stage.txMemManager.defragment();
-      }
-
       stage.flushFrameEvents();
       return;
     }