Further performance improvements

src/js/core/buffer_maintainer.js

@@ -13,7 +13,7 @@ import { round1Digit } from "./utils";
 
 const logger = createLogger("buffers");
 
-const bufferGcDurationSeconds = 10;
+const bufferGcDurationSeconds = 5;
 
 export class BufferMaintainer {
     /**
@@ -31,6 +31,29 @@ export class BufferMaintainer {
         this.root.signals.gameFrameStarted.add(this.update, this);
     }
 
+    /**
+     * Returns the buffer stats
+     */
+    getStats() {
+        let stats = {
+            rootKeys: 0,
+            subKeys: 0,
+            vramBytes: 0,
+        };
+        this.cache.forEach((subCache, key) => {
+            ++stats.rootKeys;
+
+            subCache.forEach((cacheEntry, subKey) => {
+                ++stats.subKeys;
+
+                const canvas = cacheEntry.canvas;
+                stats.vramBytes += canvas.width * canvas.height * 4;
+            });
+        });
+
+        return stats;
+    }
+
     /**
      * Goes to the next buffer iteration, clearing all buffers which were not used
      * for a few iterations

src/js/game/core.js

@@ -9,7 +9,7 @@ import { DrawParameters } from "../core/draw_parameters";
 import { gMetaBuildingRegistry } from "../core/global_registries";
 import { createLogger } from "../core/logging";
 import { Rectangle } from "../core/rectangle";
-import { randomInt, round2Digits } from "../core/utils";
+import { randomInt, round2Digits, round3Digits } from "../core/utils";
 import { Vector } from "../core/vector";
 import { Savegame } from "../savegame/savegame";
 import { SavegameSerializer } from "../savegame/savegame_serializer";
@@ -454,7 +454,7 @@ export class GameCore {
 
         if (G_IS_DEV && globalConfig.debug.showAtlasInfo) {
             context.font = "13px GameFont";
-            context.fillStyle = "yellow";
+            context.fillStyle = "blue";
             context.fillText(
                 "Atlas: " +
                     desiredAtlasScale +
@@ -462,8 +462,22 @@ export class GameCore {
                     round2Digits(zoomLevel) +
                     " / Effective Zoom: " +
                     round2Digits(effectiveZoomLevel),
-                200,
-                20
+                20,
+                600
+            );
+
+            const stats = this.root.buffers.getStats();
+            context.fillText(
+                "Buffers: " +
+                    stats.rootKeys +
+                    " root keys, " +
+                    stats.subKeys +
+                    " sub keys / buffers / VRAM: " +
+                    round2Digits(stats.vramBytes / (1024 * 1024)) +
+                    " MB",
+
+                20,
+                620
             );
         }
 

src/js/game/items/color_item.js

@@ -62,10 +62,10 @@ export class ColorItem extends BaseItem {
 
         const realDiameter = diameter * 0.6;
         const dpi = smoothenDpi(globalConfig.shapesSharpness * parameters.zoomLevel);
-        const key = realDiameter + "/" + dpi;
+        const key = realDiameter + "/" + dpi + "/" + this.color;
         const canvas = parameters.root.buffers.getForKey({
-            key,
-            subKey: this.color,
+            key: "coloritem",
+            subKey: key,
             w: realDiameter,
             h: realDiameter,
             dpi,

src/js/game/shape_definition.js

@@ -284,10 +284,10 @@ export class ShapeDefinition extends BasicSerializableObject {
             this.bufferGenerator = this.internalGenerateShapeBuffer.bind(this);
         }
 
-        const key = diameter + "/" + dpi;
+        const key = diameter + "/" + dpi + "/" + this.cachedHash;
         const canvas = parameters.root.buffers.getForKey({
-            key,
-            subKey: this.cachedHash,
+            key: "shapedef",
+            subKey: key,
             w: diameter,
             h: diameter,
             dpi,

src/js/game/systems/map_resources.js

@@ -13,7 +13,7 @@ export class MapResourcesSystem extends GameSystem {
      */
     drawChunk(parameters, chunk) {
         const basicChunkBackground = this.root.buffers.getForKey({
-            key: "chunkres",
+            key: "mapresourcebg",
             subKey: chunk.renderKey,
             w: globalConfig.mapChunkSize,
             h: globalConfig.mapChunkSize,