From b41e8b832af42871e92b7535ec39d6a3ea1f2a0e Mon Sep 17 00:00:00 2001
From: Ryan Barlow <ryanbarlow123@me.com>
Date: Sat, 3 Jan 2026 22:02:58 +0000
Subject: [PATCH] =?UTF-8?q?Only=20updates=20the=20controls=E2=80=99=20styl?=
 =?UTF-8?q?es=20when=20those=20values=20change;=20otherwise=20skips=20DOM?=
 =?UTF-8?q?=20writes?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../graphics/layers/StructureIconsLayer.ts    | 24 ++++++++++++++++---
 1 file changed, 21 insertions(+), 3 deletions(-)

diff --git a/src/client/graphics/layers/StructureIconsLayer.ts b/src/client/graphics/layers/StructureIconsLayer.ts
index 7deeba45b..d75d764bb 100644
--- a/src/client/graphics/layers/StructureIconsLayer.ts
+++ b/src/client/graphics/layers/StructureIconsLayer.ts
@@ -92,6 +92,11 @@ export class StructureIconsLayer implements Layer {
     cancel: HTMLButtonElement;
     flip: HTMLButtonElement;
   } | null = null;
+  private ghostControlsStyle: {
+    left: number;
+    top: number;
+    scale: number;
+  } | null = null;
   private readonly structures: Map<UnitType, { visible: boolean }> = new Map([
     [UnitType.City, { visible: true }],
     [UnitType.Factory, { visible: true }],
@@ -665,6 +670,7 @@ export class StructureIconsLayer implements Layer {
     if (!this.ghostControls) return;
     this.ghostControls.container.remove();
     this.ghostControls = null;
+    this.ghostControlsStyle = null;
   }
 
   private updateGhostControls(localX: number, localY: number, rect: DOMRect) {
@@ -689,9 +695,21 @@ export class StructureIconsLayer implements Layer {
       0.75,
       Math.min(1.4, this.transformHandler.scale / 2),
     );
-    this.ghostControls!.container.style.left = `${rect.left + localX}px`;
-    this.ghostControls!.container.style.top = `${rect.top + localY + offsetY}px`;
-    this.ghostControls!.container.style.transform = `translate(-50%, 0) scale(${scale})`;
+    const left = rect.left + localX;
+    const top = rect.top + localY + offsetY;
+
+    const cached = this.ghostControlsStyle;
+    if (
+      !cached ||
+      cached.left !== left ||
+      cached.top !== top ||
+      cached.scale !== scale
+    ) {
+      this.ghostControls!.container.style.left = `${left}px`;
+      this.ghostControls!.container.style.top = `${top}px`;
+      this.ghostControls!.container.style.transform = `translate(-50%, 0) scale(${scale})`;
+      this.ghostControlsStyle = { left, top, scale };
+    }
   }
 
   private resolveGhostRangeLevel(