Revert "Synchronize realtime data with display frames"

This reverts commit c6a1037611.

www/core/audio.js

@@ -16,14 +16,17 @@ let phoenixSpectroSocket = null;
 let phoenixSpectroRetryTimer = null;
 let phoenixSpectroDemanded = false;
 let pendingSpectroBuffer = null;
+let phoenixSpectroRaf = 0;
 let phoenixVisualsSocket = null;
 let phoenixVisualsRetryTimer = null;
 let pendingVisualsBuffer = null;
+let phoenixVisualsRaf = 0;
 let envRef = null;
 let lifecycleHandlersBound = false;
 let recoverTimer = null;
 let lastHardRecoverAt = 0;
 let pendingPhoenixFrame = null;
+let phoenixPacketBusy = false;
 
 const RMS_RING = { L: new Float32Array(512), R: new Float32Array(512), i: 0, n: 0 };
 const WAVEFORM_RING_SECONDS = 20;
@@ -103,6 +106,8 @@ function closePhoenixSocket() {
   phoenixSpectroSocket = null;
   phoenixSpectroDemanded = false;
   pendingSpectroBuffer = null;
+  if (phoenixSpectroRaf) cancelAnimationFrame(phoenixSpectroRaf);
+  phoenixSpectroRaf = 0;
   if (phoenixVisualsRetryTimer) clearTimeout(phoenixVisualsRetryTimer);
   phoenixVisualsRetryTimer = null;
   if (phoenixVisualsSocket) {
@@ -116,7 +121,10 @@ function closePhoenixSocket() {
   }
   phoenixVisualsSocket = null;
   pendingVisualsBuffer = null;
+  if (phoenixVisualsRaf) cancelAnimationFrame(phoenixVisualsRaf);
+  phoenixVisualsRaf = 0;
   pendingPhoenixFrame = null;
+  phoenixPacketBusy = false;
 }
 
 async function requestPhoenixRtaConfig(baseUrl, config) {
@@ -261,6 +269,7 @@ function openPhoenixSpectroSocket(baseUrl, env) {
   socket.onmessage = (event) => {
     if (!(event.data instanceof ArrayBuffer)) return;
     pendingSpectroBuffer = event.data;
+    scheduleSpectroBufferPump(env);
   };
 
   const retry = () => {
@@ -297,6 +306,27 @@ function setPhoenixSpectroDemand(baseUrl, env, demanded) {
     } catch (_) {}
   }
   pendingSpectroBuffer = null;
+  if (phoenixSpectroRaf) cancelAnimationFrame(phoenixSpectroRaf);
+  phoenixSpectroRaf = 0;
+}
+
+function scheduleSpectroBufferPump(env) {
+  if (phoenixSpectroRaf || !pendingSpectroBuffer) return;
+  phoenixSpectroRaf = requestAnimationFrame(() => {
+    phoenixSpectroRaf = 0;
+    const buffer = pendingSpectroBuffer;
+    pendingSpectroBuffer = null;
+    try {
+      const decoded = decodePhoenixSpectroBuffer(buffer);
+      if (!decoded) return;
+      if (!copyPhoenixSpectroBins(env.audio, decoded)) return;
+      env.requestRender?.('spectro');
+    } catch (err) {
+      console.warn('Phoenix spectrogram packet error:', err);
+    } finally {
+      if (pendingSpectroBuffer) scheduleSpectroBufferPump(env);
+    }
+  });
 }
 
 function openPhoenixVisualsSocket(baseUrl, env) {
@@ -310,6 +340,7 @@ function openPhoenixVisualsSocket(baseUrl, env) {
   socket.onmessage = (event) => {
     if (!(event.data instanceof ArrayBuffer)) return;
     pendingVisualsBuffer = event.data;
+    scheduleVisualsBufferPump(env);
   };
   const retry = () => {
     if (phoenixVisualsSocket === socket) phoenixVisualsSocket = null;
@@ -324,6 +355,22 @@ function openPhoenixVisualsSocket(baseUrl, env) {
   socket.onclose = retry;
 }
 
+function scheduleVisualsBufferPump(env) {
+  if (phoenixVisualsRaf || !pendingVisualsBuffer) return;
+  phoenixVisualsRaf = requestAnimationFrame(() => {
+    phoenixVisualsRaf = 0;
+    const buffer = pendingVisualsBuffer;
+    pendingVisualsBuffer = null;
+    try {
+      applyVisualsBuffer(env, buffer);
+    } catch (err) {
+      console.warn('Phoenix visual packet error:', err);
+    } finally {
+      if (pendingVisualsBuffer) scheduleVisualsBufferPump(env);
+    }
+  });
+}
+
 function applyVisualsBuffer(env, buffer) {
   const decoded = decodePhoenixVisualsBuffer(buffer);
   if (!decoded) return;
@@ -579,49 +626,32 @@ function mergePendingPhoenixFrame(previous, next) {
   return merged;
 }
 
-function enqueuePhoenixFrame(frame) {
-  pendingPhoenixFrame = mergePendingPhoenixFrame(pendingPhoenixFrame, frame);
-}
-
-// WebSocket delivery and the display's VSync are independent clocks. Keep the
-// callbacks allocation-light and publish one coherent newest-state snapshot at
-// the beginning of the single canvas render loop. This prevents metrics,
-// visuals and spectrogram updates from being applied in bursts between frames.
-export async function flushPendingPhoenixData(env, CONFIG) {
-  const metricsFrame = pendingPhoenixFrame;
-  const visualsBuffer = pendingVisualsBuffer;
-  const spectroBuffer = pendingSpectroBuffer;
-  pendingPhoenixFrame = null;
-  pendingVisualsBuffer = null;
-  pendingSpectroBuffer = null;
-
-  if (metricsFrame) {
+function schedulePhoenixPacketPump(env, CONFIG) {
+  if (phoenixPacketBusy || !pendingPhoenixFrame) return;
+  phoenixPacketBusy = true;
+  void (async () => {
     try {
-      const packet = buildPhoenixMeterPacket(metricsFrame);
-      await applyIncomingAudioPacket(env, packet, CONFIG, performance.now());
-    } catch (err) {
-      console.warn('Phoenix packet error:', err);
-    }
-  }
-
-  if (visualsBuffer) {
-    try {
-      applyVisualsBuffer(env, visualsBuffer);
-    } catch (err) {
-      console.warn('Phoenix visual packet error:', err);
-    }
-  }
-
-  if (spectroBuffer) {
-    try {
-      const decoded = decodePhoenixSpectroBuffer(spectroBuffer);
-      if (decoded && copyPhoenixSpectroBins(env.audio, decoded)) {
-        env.requestRender?.('spectro');
+      // Consume the newest packet immediately. Incoming packets are still
+      // coalesced while an asynchronous meter/config update is in progress,
+      // but they no longer wait for a second requestAnimationFrame loop.
+      while (pendingPhoenixFrame) {
+        const frame = pendingPhoenixFrame;
+        pendingPhoenixFrame = null;
+        const packet = buildPhoenixMeterPacket(frame);
+        await applyIncomingAudioPacket(env, packet, CONFIG, performance.now());
       }
     } catch (err) {
-      console.warn('Phoenix spectrogram packet error:', err);
+      console.warn('Phoenix packet error:', err);
+    } finally {
+      phoenixPacketBusy = false;
+      if (pendingPhoenixFrame) schedulePhoenixPacketPump(env, CONFIG);
     }
-  }
+  })();
+}
+
+function enqueuePhoenixFrame(env, CONFIG, frame) {
+  pendingPhoenixFrame = mergePendingPhoenixFrame(pendingPhoenixFrame, frame);
+  schedulePhoenixPacketPump(env, CONFIG);
 }
 
 function bindLifecycleHandlers() {
@@ -1144,7 +1174,7 @@ async function initPhoenixAudio(env) {
     socket.onmessage = (event) => {
       try {
         const frame = JSON.parse(event.data);
-        enqueuePhoenixFrame(frame);
+        enqueuePhoenixFrame(env, CONFIG, frame);
       } catch (err) {
         console.warn('Phoenix metrics parse error:', err);
       }