@xiboplayer/renderer 0.7.6 → 0.7.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xiboplayer/renderer",
-  "version": "0.7.6",
+  "version": "0.7.8",
   "description": "RendererLite - Fast, efficient XLF layout rendering engine",
   "type": "module",
   "main": "./src/index.js",
@@ -12,9 +12,9 @@
   },
   "dependencies": {
     "pdfjs-dist": "^4.10.38",
-    "@xiboplayer/cache": "0.7.6",
-    "@xiboplayer/utils": "0.7.6",
-    "@xiboplayer/schedule": "0.7.6"
+    "@xiboplayer/cache": "0.7.8",
+    "@xiboplayer/schedule": "0.7.8",
+    "@xiboplayer/utils": "0.7.8"
   },
   "devDependencies": {
     "jsdom": "^25.0.1",

package/src/index.d.ts

@@ -74,6 +74,7 @@ export class RendererLite {
 
   updateLayoutDuration(): void;
   checkLayoutComplete(): void;
+  hasActiveLayoutTimer(): boolean;
 
   cleanup(): void;
 }

package/src/layout-pool.js

@@ -167,6 +167,15 @@ export class LayoutPool {
    * @param {HTMLElement} container
    */
   static releaseMediaElements(container) {
+    // Defer the actual release by one animation frame to give the GPU compositor
+    // time to stop referencing textures from the old layout. Without this delay,
+    // the compositor may still hold stale mailbox references when we destroy the
+    // video backing, causing SharedImageManager::ProduceSkia "non-existent mailbox"
+    // errors (Chrome bug: race in shared_image_manager.cc acknowledged in a TODO).
+    requestAnimationFrame(() => LayoutPool._releaseMediaElementsSync(container));
+  }
+
+  static _releaseMediaElementsSync(container) {
     let videoCount = 0;
     let hlsCount = 0;
 
@@ -195,13 +204,43 @@ export class LayoutPool {
       a.load();
     });
 
+    // Release media inside iframes (embedded widgets with HLS streams, webcams, etc.)
+    // We can't querySelectorAll('video') across iframe boundaries, but we can:
+    // 1. Try to access same-origin iframe contentDocument
+    // 2. Force-remove the iframe src to stop all network activity
+    let iframeCount = 0;
+    container.querySelectorAll('iframe').forEach(iframe => {
+      try {
+        // Same-origin iframes: reach inside and release videos
+        const doc = iframe.contentDocument || iframe.contentWindow?.document;
+        if (doc) {
+          doc.querySelectorAll('video').forEach(v => {
+            v.pause();
+            v.removeAttribute('src');
+            v.load();
+            videoCount++;
+          });
+          doc.querySelectorAll('audio').forEach(a => {
+            a.pause();
+            a.removeAttribute('src');
+            a.load();
+          });
+        }
+      } catch (_) {
+        // Cross-origin: can't access contentDocument
+      }
+      // Force stop all iframe network activity (HLS segments, SSE, WebSocket, etc.)
+      iframe.src = 'about:blank';
+      iframeCount++;
+    });
+
     // Destroy PDF documents and release GPU canvas backing stores
     container.querySelectorAll('.pdf-widget').forEach(el => {
       if (el._pdfDestroy) el._pdfDestroy();
     });
 
-    if (videoCount > 0) {
-      log.info(`Released ${videoCount} video(s)${hlsCount ? ` (${hlsCount} HLS)` : ''}`);
+    if (videoCount > 0 || iframeCount > 0) {
+      log.info(`Released ${videoCount} video(s)${hlsCount ? ` (${hlsCount} HLS)` : ''}${iframeCount ? `, ${iframeCount} iframe(s)` : ''}`);
     }
   }
 

package/src/renderer-lite.js

@@ -1860,27 +1860,36 @@ export class RendererLite {
     }
 
     const videoEl = widgetElement.querySelector('video');
-    if (videoEl && widget.options.loop !== '1') videoEl.pause();
+    if (videoEl) {
+      videoEl.pause();
 
-    // Stop MediaStream tracks (webcam/mic) to release the device
-    if (videoEl?._mediaStream) {
-      videoEl._mediaStream.getTracks().forEach(t => t.stop());
-      videoEl._mediaStream = null;
-      videoEl.srcObject = null;
-    }
+      // Stop MediaStream tracks (webcam/mic) to release the device
+      if (videoEl._mediaStream) {
+        videoEl._mediaStream.getTracks().forEach(t => t.stop());
+        videoEl._mediaStream = null;
+        videoEl.srcObject = null;
+      }
 
-    // Destroy HLS.js instance to free worker + buffers
-    if (videoEl?._hlsInstance) {
-      videoEl._hlsInstance.destroy();
-      videoEl._hlsInstance = null;
-    }
+      // Destroy HLS.js instance to free worker + buffers
+      if (videoEl._hlsInstance) {
+        videoEl._hlsInstance.destroy();
+        videoEl._hlsInstance = null;
+      }
+
+      // Release decoded video buffers (GPU dmabufs) — without this, paused
+      // videos hold texture memory until the layout is evicted from the pool.
+      // removeAttribute('src') + load() forces the browser to drop the decoded
+      // frame, releasing GPU dmabufs immediately instead of at pool eviction.
+      videoEl.removeAttribute('src');
+      videoEl.load();
 
-    // Remove event listeners to prevent accumulation across widget cycles
-    if (videoEl?._eventCleanup) {
-      for (const [event, handler] of videoEl._eventCleanup) {
-        videoEl.removeEventListener(event, handler);
+      // Remove event listeners to prevent accumulation across widget cycles
+      if (videoEl._eventCleanup) {
+        for (const [event, handler] of videoEl._eventCleanup) {
+          videoEl.removeEventListener(event, handler);
+        }
+        videoEl._eventCleanup = null;
       }
-      videoEl._eventCleanup = null;
     }
 
     const audioEl = widgetElement.querySelector('audio');
@@ -1902,6 +1911,21 @@ export class RendererLite {
       widgetElement._pdfCleanup();
     }
 
+    // Stop embedded widget iframes (HLS live streams, webcams, etc.)
+    // Setting src=about:blank kills all network activity (HLS segment fetches,
+    // WebSocket connections, SSE streams) and releases video decode buffers.
+    const iframes = widgetElement.querySelectorAll('iframe');
+    for (const iframe of iframes) {
+      try {
+        const doc = iframe.contentDocument || iframe.contentWindow?.document;
+        if (doc) {
+          doc.querySelectorAll('video').forEach(v => { v.pause(); v.removeAttribute('src'); v.load(); });
+          doc.querySelectorAll('audio').forEach(a => { a.pause(); a.removeAttribute('src'); a.load(); });
+        }
+      } catch (_) {}
+      iframe.src = 'about:blank';
+    }
+
     return { widget, animPromise };
   }
 
@@ -2863,6 +2887,13 @@ export class RendererLite {
       return true;
     }
 
+    // Don't preload if already in-flight (prevents triple preload when
+    // 75% and 90% timers both fire before the async preload completes)
+    if (this._preloadingLayoutId === layoutId) {
+      this.log.info(`Layout ${layoutId} preload already in-flight, skipping`);
+      return true;
+    }
+
     try {
       this.log.info(`Preloading layout ${layoutId} into pool...`);
 
@@ -3095,6 +3126,50 @@ export class RendererLite {
     }
 
     this.log.info(`Swapped to preloaded layout ${layoutId} (instant transition)`);
+    this._logResourceStats(layoutId);
+  }
+
+  /**
+   * Log resource allocation stats for debugging memory/GPU leaks.
+   * Called after every layout swap to track DOM node accumulation,
+   * video element lifecycle, and pool state.
+   */
+  _logResourceStats(layoutId) {
+    const domNodes = document.querySelectorAll('*').length;
+    const videos = document.querySelectorAll('video').length;
+    const videosSrc = document.querySelectorAll('video[src]').length;
+    const canvases = document.querySelectorAll('canvas').length;
+    const iframes = document.querySelectorAll('iframe').length;
+    const images = document.querySelectorAll('img').length;
+    const poolSize = this.layoutPool ? this.layoutPool.size : 0;
+    const regionCount = this.regions ? this.regions.size : 0;
+    const widgetElements = [...(this.regions?.values() || [])].reduce(
+      (sum, r) => sum + (r.widgetElements?.size || 0), 0
+    );
+    const jsHeap = performance?.memory ? {
+      used: Math.round(performance.memory.usedJSHeapSize / 1048576),
+      total: Math.round(performance.memory.totalJSHeapSize / 1048576),
+      limit: Math.round(performance.memory.jsHeapSizeLimit / 1048576),
+    } : null;
+
+    // Count blob URLs still tracked (potential leak indicator)
+    const blobUrls = this._blobUrls ? [...this._blobUrls.values()].reduce((s, set) => s + set.size, 0) : 0;
+    const blobLayouts = this._blobUrls ? this._blobUrls.size : 0;
+
+    // Preload wrapper divs in DOM (should be 0-1 in normal operation)
+    const preloadWrappers = document.querySelectorAll('.renderer-lite-preload-wrapper').length;
+
+    // Audio overlay elements
+    const audioEls = document.querySelectorAll('audio').length;
+
+    const heapStr = jsHeap ? `heap=${jsHeap.used}/${jsHeap.total}MB (limit ${jsHeap.limit}MB)` : 'heap=N/A';
+    this.log.info(
+      `[Resources] layout=${layoutId} dom=${domNodes} videos=${videos}(src=${videosSrc}) ` +
+      `canvas=${canvases} iframe=${iframes} img=${images} audio=${audioEls} ` +
+      `pool=${poolSize} preloadWrappers=${preloadWrappers} ` +
+      `regions=${regionCount} widgets=${widgetElements} ` +
+      `blobs=${blobUrls}(${blobLayouts} layouts) ${heapStr}`
+    );
   }
 
   /**
@@ -3132,6 +3207,15 @@ export class RendererLite {
     this._swapToPreloadedLayout(layoutId);
   }
 
+  /**
+   * Check if the layout timer is active (running or deferred waiting for metadata).
+   * Used to detect stalled layouts that need timer restart.
+   * @returns {boolean}
+   */
+  hasActiveLayoutTimer() {
+    return this.layoutTimer !== null || this._deferredTimerLayoutId !== null;
+  }
+
   /**
    * Check if all regions have completed one full cycle
    * This is informational only - layout timer is authoritative

package/src/renderer-lite.test.js

@@ -817,12 +817,9 @@ describe('RendererLite', () => {
       const region = { id: 'r1', widgets: [widget1, widget2], isDrawer: false };
       renderer.regions = new Map([['r1', region]]);
 
-      // One still unprobed
-      expect(renderer._hasUnprobedVideos()).toBe(true);
-
-      // Probe the second
-      widget2.duration = 30;
-      widget2._probed = true;
+      // Once any video is probed, updateLayoutDuration has already run with
+      // real metadata, so _hasUnprobedVideos() returns false — no further
+      // deferral needed.
       expect(renderer._hasUnprobedVideos()).toBe(false);
     });
   });