agentgui 1.0.782 → 1.0.783

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/package.json +1 -1
  2. package/static/index.html +20 -4
  3. package/static/js/client.js +6 -12
  4. package/static/js/tools-manager.js +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "agentgui",
3
- "version": "1.0.782",
3
+ "version": "1.0.783",
4
4
  "description": "Multi-agent ACP client with real-time communication",
5
5
  "type": "module",
6
6
  "main": "electron/main.js",
package/static/index.html CHANGED
@@ -6,23 +6,39 @@
6
6
  <meta name="description" content="AgentGUI - Real-time Claude Code Execution Visualization">
7
7
  <title>AgentGUI</title>
8
8
  <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Crect width='100' height='100' rx='20' fill='%233b82f6'/%3E%3Ctext x='50' y='68' font-size='50' font-family='sans-serif' font-weight='bold' fill='white' text-anchor='middle'%3EG%3C/text%3E%3C/svg%3E">
9
+ <link rel="preload" href="/gm/css/main.css" as="style">
10
+ <link rel="preload" href="/gm/lib/xstate.umd.min.js" as="script">
11
+ <link rel="preload" href="/gm/lib/msgpackr.min.js" as="script">
9
12
 
10
13
 
11
14
 
12
15
  <script>
13
16
  (function(){
14
17
  var b=(window.__BASE_URL||'');
15
- ['vendor/rippleui.css','vendor/prism-dark.css','vendor/highlight-js.css','vendor/xterm.css'].forEach(function(h){
18
+ // Critical CSS only - rippleui needed for layout
19
+ ['vendor/rippleui.css'].forEach(function(h){
16
20
  var l=document.createElement('link');l.rel='stylesheet';l.href=b+'/'+h;document.head.appendChild(l);
17
21
  });
18
- ['vendor/highlight.min.js','vendor/xterm.min.js','vendor/xterm-addon-fit.min.js'].forEach(function(s){
19
- var e=document.createElement('script');e.defer=true;e.src=b+'/'+s;document.head.appendChild(e);
22
+ // Non-critical CSS - load async via media trick
23
+ ['vendor/prism-dark.css','vendor/highlight-js.css','vendor/xterm.css'].forEach(function(h){
24
+ var l=document.createElement('link');l.rel='stylesheet';l.href=b+'/'+h;l.media='print';l.onload=function(){l.media='all';};document.head.appendChild(l);
20
25
  });
26
+ // Vendor JS - lazy load on idle or first use
27
+ window._vendorLoaded = false;
28
+ window._loadVendorJS = function() {
29
+ if (window._vendorLoaded) return;
30
+ window._vendorLoaded = true;
31
+ ['vendor/highlight.min.js','vendor/xterm.min.js','vendor/xterm-addon-fit.min.js'].forEach(function(s){
32
+ var e=document.createElement('script');e.defer=true;e.src=b+'/'+s;document.head.appendChild(e);
33
+ });
34
+ };
35
+ if (typeof requestIdleCallback !== 'undefined') requestIdleCallback(window._loadVendorJS, { timeout: 3000 });
36
+ else setTimeout(window._loadVendorJS, 1500);
21
37
  })();
22
38
  </script>
23
39
 
24
40
  <link rel="stylesheet" href="/gm/css/main.css">
25
- <link rel="stylesheet" href="/gm/css/tools-popup.css">
41
+ <link rel="stylesheet" href="/gm/css/tools-popup.css" media="print" onload="this.media='all'">
26
42
  </head>
27
43
  <body>
28
44
  <!-- Sidebar overlay (mobile) -->
package/static/js/client.js CHANGED
@@ -103,28 +103,22 @@ class AgentGUIClient {
103
103
  try {
104
104
  this._dbg('Initializing AgentGUI client');
105
105
 
106
- // Initialize renderer
106
+ // Start WebSocket connection immediately (don't wait for UI setup)
107
+ const wsReady = this.config.autoConnect ? this.connectWebSocket() : Promise.resolve();
108
+
109
+ // Initialize renderer and UI in parallel with WS connection
107
110
  this.renderer.init(this.config.outputContainerId, this.config.scrollContainerId);
108
111
 
109
- // Initialize image loader
110
112
  if (typeof ImageLoader !== 'undefined') {
111
113
  window.imageLoader = new ImageLoader();
112
- this._dbg('Image loader initialized');
113
114
  }
114
115
 
115
- // Setup event listeners
116
116
  this.setupWebSocketListeners();
117
117
  this.setupRendererListeners();
118
-
119
- // Setup UI elements (must happen before loading data so DOM refs exist)
120
118
  this.setupUI();
121
119
 
122
- // Connect WebSocket before loading data (RPC requires connection)
123
- if (this.config.autoConnect) {
124
- await this.connectWebSocket();
125
- }
126
-
127
- // Load initial data in parallel - none of these depend on each other
120
+ // Wait for WS, then load data in parallel
121
+ await wsReady;
128
122
  await Promise.all([
129
123
  this.loadAgents(),
130
124
  this.loadConversations(),
package/static/js/tools-manager.js CHANGED
@@ -4,16 +4,16 @@
4
4
  var tools = [];
5
5
  var isRefreshing = false;
6
6
 
7
+ var hasRefreshed = false;
7
8
  function init() {
8
9
  if (!btn || !popup) return;
9
10
  btn.style.display = 'flex';
10
- btn.addEventListener('click', togglePopup);
11
+ btn.addEventListener('click', function() { if (!hasRefreshed) { hasRefreshed = true; refresh(); } togglePopup(); });
11
12
  document.addEventListener('click', function(e) {
12
13
  if (!btn.contains(e.target) && !popup.contains(e.target)) closePopup();
13
14
  });
14
15
  window.addEventListener('ws-message', onWsMessage);
15
16
  initVoiceControls();
16
- refresh();
17
17
  }
18
18
 
19
19
  function initVoiceControls() {