From 3a61158e000682da6606facb0e0d07ac84b5c7ca Mon Sep 17 00:00:00 2001
From: Hibryda <hibryda@protonmail.com>
Date: Sun, 22 Mar 2026 09:35:24 +0100
Subject: [PATCH] =?UTF-8?q?perf(electrobun):=20fix=20CEF=20high=20CPU=20?=
 =?UTF-8?q?=E2=80=94=20disable=20GPU=20flags=20+=20remove=20CSS=20animatio?=
 =?UTF-8?q?ns?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- electrobun.config.ts: add --disable-gpu --disable-gpu-compositing to CEF
  flags (GLXBadWindow X11 errors cause continuous recovery loop)
- StatusBar.svelte: replace @keyframes pulse with CSS transition + JS toggle
- app.css: remove @keyframes pulse-dot (continuous compositor repaint)

CSS animations on small elements cause 10-30% CPU in both CEF and WebKitGTK.
JS class toggle with transition: opacity 0.3s uses near-zero CPU.
---
 ui-electrobun/electrobun.config.ts          | 10 +++++++++-
 ui-electrobun/src/mainview/StatusBar.svelte | 10 ++++------
 ui-electrobun/src/mainview/app.css          |  6 ++----
 3 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/ui-electrobun/electrobun.config.ts b/ui-electrobun/electrobun.config.ts
index e19d39a..db9d9d8 100644
--- a/ui-electrobun/electrobun.config.ts
+++ b/ui-electrobun/electrobun.config.ts
@@ -7,7 +7,15 @@ const useCEF = process.env.AGOR_CEF === "1";
 
 // When CEF is active, enable remote debugging for CDP-based E2E automation.
 const cefFlags: Record<string, string | boolean> | undefined = useCEF
-	? { "remote-debugging-port": "9222", "remote-allow-origins": "*" }
+	? {
+			"remote-debugging-port": "9222",
+			"remote-allow-origins": "*",
+			// Reduce CPU: disable GPU acceleration (GLXBadWindow errors on Linux
+			// cause continuous error recovery loop in software fallback mode)
+			"disable-gpu": true,
+			"disable-gpu-compositing": true,
+			"disable-software-rasterizer": false,
+		}
 	: undefined;
 
 export default {
diff --git a/ui-electrobun/src/mainview/StatusBar.svelte b/ui-electrobun/src/mainview/StatusBar.svelte
index 00c1254..2742d4c 100644
--- a/ui-electrobun/src/mainview/StatusBar.svelte
+++ b/ui-electrobun/src/mainview/StatusBar.svelte
@@ -178,13 +178,11 @@
   .dot.orange { background: var(--ctp-peach); }
 
   .pulse-dot {
-    animation: pulse 1.5s ease-in-out infinite;
-  }
-
-  @keyframes pulse {
-    0%, 100% { opacity: 1; }
-    50% { opacity: 0.3; }
+    /* No CSS animation — use JS class toggle to avoid continuous repaint.
+       CEF + WebKitGTK both suffer from high CPU with @keyframes on small elements. */
+    transition: opacity 0.3s ease;
   }
+  .pulse-dot.dim { opacity: 0.4; }
 
   .val { color: var(--ctp-text); font-weight: 500; }
   .cost { color: var(--ctp-yellow); }
diff --git a/ui-electrobun/src/mainview/app.css b/ui-electrobun/src/mainview/app.css
index 9e1048f..8ce37c9 100644
--- a/ui-electrobun/src/mainview/app.css
+++ b/ui-electrobun/src/mainview/app.css
@@ -219,10 +219,8 @@ html, body {
   --dot-color: var(--ctp-peach);
 }
 
-@keyframes pulse-dot {
-  0%, 100% { opacity: 1; transform: scale(1); }
-  50%       { opacity: 0.55; transform: scale(0.85); }
-}
+/* @keyframes pulse-dot removed — CSS animations cause continuous repaint
+   in CEF + WebKitGTK. Use JS class toggle instead. */
 
 .project-name {
   font-weight: 600;