@livepeer-frameworks/player-core 0.0.3 → 0.1.0

package/src/players/DashJsPlayer.ts

@@ -296,16 +296,17 @@ export class DashJsPlayerImpl extends BasePlayer {
       });
 
       // Configure dashjs v5 streaming settings BEFORE initialization
+      // AGGRESSIVE settings for fastest startup and low latency
       this.dashPlayer.updateSettings({
         streaming: {
-          // Buffer settings
+          // AGGRESSIVE: Minimal buffers for fastest startup
           buffer: {
             fastSwitchEnabled: true,
-            stableBufferTime: 16,
-            bufferTimeAtTopQuality: 30,
-            bufferTimeAtTopQualityLongForm: 60,
-            bufferToKeep: 30,
-            bufferPruningInterval: 30,
+            stableBufferTime: 4,           // Reduced from 16 (aggressive!)
+            bufferTimeAtTopQuality: 8,     // Reduced from 30
+            bufferTimeAtTopQualityLongForm: 15, // Reduced from 60
+            bufferToKeep: 10,              // Reduced from 30
+            bufferPruningInterval: 10,     // Reduced from 30
           },
           // Gaps/stall handling
           gaps: {
@@ -314,12 +315,23 @@ export class DashJsPlayerImpl extends BasePlayer {
             smallGapLimit: 1.5,
             threshold: 0.3,
           },
-          // ABR - try disabling to isolate the issue
+          // AGGRESSIVE: ABR with high initial bitrate estimate
           abr: {
             autoSwitchBitrate: { video: true, audio: true },
             limitBitrateByPortal: false,
             useDefaultABRRules: true,
-            initialBitrate: { video: -1, audio: -1 },  // Let dashjs choose
+            initialBitrate: { video: 5_000_000, audio: 128_000 },  // 5Mbps initial (was -1)
+          },
+          // LIVE CATCHUP - critical for maintaining live edge (was missing!)
+          liveCatchup: {
+            enabled: true,
+            maxDrift: 1.5,            // Seek to live if drift > 1.5s
+            playbackRate: {
+              max: 0.15,              // Speed up by max 15%
+              min: -0.15,             // Slow down by max 15%
+            },
+            playbackBufferMin: 0.3,   // Min buffer before catchup
+            mode: 'liveCatchupModeDefault',
           },
           // Retry settings - more aggressive
           retryAttempts: {
@@ -354,11 +366,11 @@ export class DashJsPlayerImpl extends BasePlayer {
           abandonLoadTimeout: 5000,  // 5 seconds instead of default 10
           xhrWithCredentials: false,
           text: { defaultEnabled: false },
-          // Live delay settings for live streams
+          // AGGRESSIVE: Tighter live delay
           delay: {
-            liveDelay: 4,  // Target 4 seconds behind live edge
+            liveDelay: 2,  // Reduced from 4 (2s behind live edge)
             liveDelayFragmentCount: null,
-            useSuggestedPresentationDelay: true,
+            useSuggestedPresentationDelay: false,  // Ignore manifest suggestions
           },
         },
         debug: {

package/src/players/HlsJsPlayer.ts

@@ -3,6 +3,7 @@ import { checkProtocolMismatch, getBrowserInfo } from '../core/detector';
 import { translateCodec } from '../core/CodecUtils';
 import { LiveDurationProxy } from '../core/LiveDurationProxy';
 import type { StreamSource, StreamInfo, PlayerOptions, PlayerCapability } from '../core/PlayerInterface';
+import type { HlsJsConfig } from '../types';
 
 // Player implementation class
 export class HlsJsPlayerImpl extends BasePlayer {
@@ -148,13 +149,36 @@ export class HlsJsPlayerImpl extends BasePlayer {
       console.log('[HLS.js] hls.js module imported, Hls.isSupported():', Hls.isSupported?.());
 
       if (Hls.isSupported()) {
-        this.hls = new Hls({
+        // Build optimized HLS.js config with user overrides
+        const hlsConfig: HlsJsConfig = {
+          // Worker disabled for lower latency (per HLS.js maintainer recommendation)
           enableWorker: false,
+
+          // LL-HLS support
           lowLatencyMode: true,
-          maxBufferLength: 15,
-          maxMaxBufferLength: 60,
-          backBufferLength: 30  // Reduced from 90 to prevent memory issues on long streams
-        });
+
+          // AGGRESSIVE: Assume 5 Mbps initially (not 500kbps default)
+          // This dramatically improves startup time by selecting appropriate quality faster
+          abrEwmaDefaultEstimate: 5_000_000,
+
+          // AGGRESSIVE: Minimal buffers for fastest startup
+          maxBufferLength: 6,         // Reduced from 15 (just 2 segments @ 3s)
+          maxMaxBufferLength: 15,     // Reduced from 60
+          backBufferLength: Infinity, // Let browser manage (per maintainer advice)
+
+          // Stay close to live edge but not too aggressive
+          liveSyncDuration: 4,        // Target 4 seconds behind live edge
+          liveMaxLatencyDuration: 8,  // Max 8 seconds before seeking to live
+
+          // Faster ABR adaptation for live
+          abrEwmaFastLive: 2.0,       // Faster than default 3.0
+          abrEwmaSlowLive: 6.0,       // Faster than default 9.0
+
+          // Allow user overrides
+          ...options.hlsConfig,
+        };
+
+        this.hls = new Hls(hlsConfig);
 
         this.hls.attachMedia(video);
 

package/src/players/MewsWsPlayer/SourceBufferManager.ts

@@ -314,7 +314,7 @@ export class SourceBufferManager {
       try {
         // Make sure end time is never 0 (mews.js:376)
         this.sourceBuffer.remove(0, Math.max(0.1, currentTime - keepaway));
-      } catch (e) {
+      } catch {
         // Ignore errors during cleanup
       }
     });
@@ -343,7 +343,7 @@ export class SourceBufferManager {
         if (!isNaN(this.mediaSource.duration)) {
           this.sourceBuffer.remove(0, Infinity);
         }
-      } catch (e) {
+      } catch {
         // Ignore
       }
 
@@ -371,7 +371,7 @@ export class SourceBufferManager {
     if (this.sourceBuffer && this.mediaSource.readyState === 'open') {
       try {
         this.mediaSource.removeSourceBuffer(this.sourceBuffer);
-      } catch (e) {
+      } catch {
         // Ignore
       }
     }

package/src/players/MewsWsPlayer/WebSocketManager.ts

@@ -105,7 +105,6 @@ export class WebSocketManager {
       return false;
     }
 
-    // Helper to schedule retry with tracking
     const scheduleRetry = (delay: number) => {
       const timer = setTimeout(() => {
         this.pendingRetryTimers.delete(timer);

package/src/players/MewsWsPlayer/index.ts

@@ -121,7 +121,7 @@ export class MewsWsPlayerImpl extends BasePlayer {
     return Object.keys(playableTracks);
   }
 
-  async initialize(container: HTMLElement, source: StreamSource, options: PlayerOptions): Promise<HTMLVideoElement> {
+  async initialize(container: HTMLElement, source: StreamSource, options: PlayerOptions, streamInfo?: StreamInfo): Promise<HTMLVideoElement> {
     this.container = container;
     container.classList.add('fw-player-container');
 
@@ -153,12 +153,14 @@ export class MewsWsPlayerImpl extends BasePlayer {
       endpoint: anyOpts.analytics?.endpoint || null
     };
 
-    // Get stream type from options if available
-    if ((source as any).type === 'live') {
+    // Get stream type from streamInfo if available
+    // Note: source.type is a MIME string (e.g., 'ws/video/mp4'), not 'live'/'vod'
+    if (streamInfo?.type === 'live') {
       this.streamType = 'live';
-    } else if ((source as any).type === 'vod') {
+    } else if (streamInfo?.type === 'vod') {
       this.streamType = 'vod';
     }
+    // Fallback: will be determined by server on_time messages (end === 0 means live)
 
     try {
       // Initialize MediaSource (mews.js:138-196)
@@ -917,7 +919,7 @@ export class MewsWsPlayerImpl extends BasePlayer {
         this.sbManager?._do(() => {
           try {
             // Clear buffer for clean loop
-          } catch (e) {}
+          } catch {}
         });
       }
     });

package/src/players/MistPlayer.ts

@@ -146,7 +146,7 @@ export class MistPlayerImpl extends BasePlayer {
         if (ref && typeof ref.unload === 'function') {
           ref.unload();
         }
-      } catch (e) {
+      } catch {
         // Ignore cleanup errors
       }
       try {

package/src/players/MistWebRTCPlayer/index.ts

@@ -499,7 +499,7 @@ export class MistWebRTCPlayerImpl extends BasePlayer {
 
   // Private methods
 
-  private async setupWebRTC(video: HTMLVideoElement, source: StreamSource, options: PlayerOptions): Promise<void> {
+  private async setupWebRTC(video: HTMLVideoElement, source: StreamSource, _options: PlayerOptions): Promise<void> {
     const sourceAny = source as any;
     const iceServers: RTCIceServer[] = sourceAny?.iceServers || [];
 

package/src/players/NativePlayer.ts

@@ -109,7 +109,7 @@ export class NativePlayerImpl extends BasePlayer {
 
     // Safari cannot play WebM - skip entirely
     // Reference: html5.js:28-29
-    if (mimetype === 'html5/video/webm' && browser.name === 'safari') {
+    if (mimetype === 'html5/video/webm' && browser.isSafari) {
       return false;
     }
 
@@ -262,7 +262,7 @@ export class NativePlayerImpl extends BasePlayer {
     // Use LiveDurationProxy for all live streams (non-WHEP)
     // WHEP handles its own live edge via signaling
     // This enables seeking and jump-to-live for native MP4/WebM/HLS live streams
-    const isLiveStream = streamInfo?.type === 'live' || !isFinite(streamInfo?.duration ?? Infinity);
+    const isLiveStream = streamInfo?.type === 'live';
     if (source.type !== 'whep' && isLiveStream) {
       this.setupLiveDurationProxy(video);
       this.setupAutoRecovery(video);

package/src/players/VideoJsPlayer.ts

@@ -154,6 +154,10 @@ export class VideoJsPlayerImpl extends BasePlayer {
       // When using custom controls (controls: false), disable ALL VideoJS UI elements
       const useVideoJsControls = options.controls === true;
 
+      // Android < 7 workaround: enable overrideNative for HLS
+      const androidMatch = navigator.userAgent.match(/android\s([\d.]*)/i);
+      const androidVersion = androidMatch ? parseFloat(androidMatch[1]) : null;
+
       // Build VideoJS options
       // NOTE: We disable UI components but NOT children array - that breaks playback
       const vjsOptions: Record<string, any> = {
@@ -169,17 +173,36 @@ export class VideoJsPlayerImpl extends BasePlayer {
         controlBar: useVideoJsControls,
         liveTracker: useVideoJsControls,
         // Don't set children: [] - that can break internal VideoJS components
-      };
 
-      // Android < 7 workaround: enable overrideNative for HLS
-      const androidMatch = navigator.userAgent.match(/android\s([\d.]*)/i);
-      const androidVersion = androidMatch ? parseFloat(androidMatch[1]) : null;
-      if (androidVersion && androidVersion < 7) {
-        console.debug('[VideoJS] Android < 7 detected, enabling overrideNative');
-        vjsOptions.html5 = { hls: { overrideNative: true } };
-        vjsOptions.nativeAudioTracks = false;
-        vjsOptions.nativeVideoTracks = false;
-      }
+        // VHS (http-streaming) configuration - AGGRESSIVE for fastest startup
+        html5: {
+          vhs: {
+            // AGGRESSIVE: Start with lower quality for instant playback
+            enableLowInitialPlaylist: true,
+
+            // AGGRESSIVE: Assume 5 Mbps initially
+            bandwidth: 5_000_000,
+
+            // Persist bandwidth across sessions for returning users
+            useBandwidthFromLocalStorage: true,
+
+            // Enable partial segment processing for lower latency
+            handlePartialData: true,
+
+            // AGGRESSIVE: Very tight live range
+            liveRangeSafeTimeDelta: 0.3,
+
+            // Allow user overrides via options.vhsConfig
+            ...options.vhsConfig,
+          },
+          // Android < 7 workaround
+          ...(androidVersion && androidVersion < 7 ? {
+            hls: { overrideNative: true }
+          } : {}),
+        },
+        nativeAudioTracks: androidVersion && androidVersion < 7 ? false : undefined,
+        nativeVideoTracks: androidVersion && androidVersion < 7 ? false : undefined,
+      };
 
       console.debug('[VideoJS] Creating player with options:', vjsOptions);
       this.videojsPlayer = videojs(video, vjsOptions);
@@ -410,27 +433,6 @@ export class VideoJsPlayerImpl extends BasePlayer {
     return v?.currentTime ?? 0;
   }
 
-  getDuration(): number {
-    const v = this.proxyElement || this.videoElement;
-    return v?.duration ?? 0;
-  }
-
-  getSeekableRange(): { start: number; end: number } | null {
-    if (this.videojsPlayer?.seekable) {
-      try {
-        const seekable = this.videojsPlayer.seekable();
-        if (seekable && seekable.length > 0) {
-          const start = seekable.start(0) + this.timeCorrection;
-          const end = seekable.end(seekable.length - 1) + this.timeCorrection;
-          if (Number.isFinite(start) && Number.isFinite(end) && end >= start) {
-            return { start, end };
-          }
-        }
-      } catch {}
-    }
-    return null;
-  }
-
   /**
    * Seek to time using VideoJS API (fixes backwards seeking in HLS).
    * Time should be in the corrected coordinate space (with firstms offset applied).

package/src/players/WebCodecsPlayer/SyncController.ts

@@ -16,7 +16,6 @@
 
 import type {
   LatencyProfile,
-  BufferState,
   SyncState,
   TrackInfo,
 } from './types';
@@ -383,7 +382,7 @@ export class SyncController {
   /**
    * Register a new track
    */
-  addTrack(trackIndex: number, track: TrackInfo): void {
+  addTrack(_trackIndex: number, _track: TrackInfo): void {
     // Jitter tracking will be initialized on first chunk
   }
 

package/src/players/WebCodecsPlayer/WebSocketController.ts

@@ -183,7 +183,7 @@ export class WebSocketController {
           }
         };
 
-        this.ws.onerror = (event) => {
+        this.ws.onerror = (_event) => {
           this.log('WebSocket error');
           this.emit('error', new Error('WebSocket error'));
         };

package/src/players/WebCodecsPlayer/index.ts

@@ -27,7 +27,6 @@ import type {
   InfoMessage,
   OnTimeMessage,
   RawChunk,
-  LatencyProfileName,
   WebCodecsPlayerOptions,
   WebCodecsStats,
   MainToWorkerMessage,
@@ -36,7 +35,7 @@ import type {
 import { WebSocketController } from './WebSocketController';
 import { SyncController } from './SyncController';
 import { getPresentationTimestamp, isInitData } from './RawChunkParser';
-import { getLatencyProfile, mergeLatencyProfile, selectDefaultProfile } from './LatencyProfiles';
+import { mergeLatencyProfile, selectDefaultProfile } from './LatencyProfiles';
 import { createTrackGenerator, hasNativeMediaStreamTrackGenerator } from './polyfills/MediaStreamTrackGenerator';
 
 /**
@@ -114,11 +113,13 @@ export class WebCodecsPlayerImpl extends BasePlayer {
     name: 'WebCodecs Player',
     shortname: 'webcodecs',
     priority: 0, // Highest priority - lowest latency option
-    // Raw WebSocket (12-byte header + AVCC NAL units) - NOT MP4-muxed
+    // Raw WebSocket (12-byte header + codec frames) - NOT MP4-muxed
     // MistServer's output_wsraw.cpp provides full codec negotiation (audio + video)
+    // MistServer's output_h264.cpp uses same 12-byte header but Annex B payload (video-only)
     // NOTE: ws/video/mp4 is MP4-fragmented which needs MEWS player (uses MSE)
     mimes: [
-      'ws/video/raw', 'wss/video/raw',     // Raw codec frames (audio + video)
+      'ws/video/raw', 'wss/video/raw',     // Raw codec frames - AVCC format (audio + video)
+      'ws/video/h264', 'wss/video/h264',   // Annex B H264/HEVC (video-only, same 12-byte header)
     ],
   };
 
@@ -136,6 +137,8 @@ export class WebCodecsPlayerImpl extends BasePlayer {
   private debugging = false;
   private verboseDebugging = false;
   private streamType: 'live' | 'vod' = 'live';
+  /** Payload format: 'avcc' for ws/video/raw, 'annexb' for ws/video/h264 */
+  private payloadFormat: 'avcc' | 'annexb' = 'avcc';
   private workerUidCounter = 0;
   private workerListeners = new Map<number, (msg: WorkerToMainMessage) => void>();
 
@@ -209,7 +212,8 @@ export class WebCodecsPlayerImpl extends BasePlayer {
             }
           } else {
             // Use VideoDecoder.isConfigSupported()
-            result = await VideoDecoder.isConfigSupported(config as VideoDecoderConfig);
+            const videoResult = await VideoDecoder.isConfigSupported(config as VideoDecoderConfig);
+            result = { supported: videoResult.supported === true, config: videoResult.config };
           }
           break;
         }
@@ -217,7 +221,8 @@ export class WebCodecsPlayerImpl extends BasePlayer {
           // Audio requires numberOfChannels and sampleRate
           config.numberOfChannels = track.channels ?? 2;
           config.sampleRate = track.rate ?? 48000;
-          result = await AudioDecoder.isConfigSupported(config as AudioDecoderConfig);
+          const audioResult = await AudioDecoder.isConfigSupported(config as AudioDecoderConfig);
+          result = { supported: audioResult.supported === true, config: audioResult.config };
           break;
         }
         default:
@@ -311,6 +316,11 @@ export class WebCodecsPlayerImpl extends BasePlayer {
       }
     }
 
+    // Annex B H264 WebSocket is video-only (no audio payloads)
+    if (mimetype.includes('video/h264')) {
+      delete playableTracks.audio;
+    }
+
     if (Object.keys(playableTracks).length === 0) {
       return false;
     }
@@ -341,6 +351,13 @@ export class WebCodecsPlayerImpl extends BasePlayer {
     this._bytesReceived = 0;
     this._messagesReceived = 0;
 
+    // Detect payload format from source MIME type
+    // ws/video/h264 uses Annex B (start code delimited NALs), ws/video/raw uses AVCC (length-prefixed)
+    this.payloadFormat = source.type?.includes('h264') ? 'annexb' : 'avcc';
+    if (this.payloadFormat === 'annexb') {
+      this.log('Using Annex B payload format (ws/video/h264)');
+    }
+
     this.container = container;
     container.classList.add('fw-player-container');
 
@@ -932,7 +949,7 @@ export class WebCodecsPlayerImpl extends BasePlayer {
       const tracksObj = msg.meta.tracks;
       this.log(`Info contains ${Object.keys(tracksObj).length} tracks`);
 
-      for (const [name, track] of Object.entries(tracksObj)) {
+      for (const [_name, track] of Object.entries(tracksObj)) {
         // Store track by its index for lookup when chunks arrive
         if (track.idx !== undefined) {
           this.tracksByIndex.set(track.idx, track);
@@ -1180,6 +1197,7 @@ export class WebCodecsPlayerImpl extends BasePlayer {
       track,
       opts: {
         optimizeForLatency: this.streamType === 'live',
+        payloadFormat: this.payloadFormat, // 'avcc' for ws/video/raw, 'annexb' for ws/video/h264
       },
       uid: this.workerUidCounter++,
     });

package/src/players/WebCodecsPlayer/types.ts

@@ -213,6 +213,8 @@ export interface CreatePipelineMessage {
   track: TrackInfo;
   opts: {
     optimizeForLatency: boolean;
+    /** Payload format: 'avcc' (length-prefixed) or 'annexb' (start-code delimited) */
+    payloadFormat?: 'avcc' | 'annexb';
   };
   uid?: number;
 }
@@ -257,9 +259,10 @@ export interface ClosePipelineMessage {
 
 export interface FrameTimingMessage {
   type: 'frametiming';
-  action: 'setSpeed' | 'reset';
+  action: 'setSpeed' | 'reset' | 'setPaused';
   speed?: number;
   tweak?: number;
+  paused?: boolean;
   uid?: number;
 }
 
@@ -275,6 +278,20 @@ export interface DebuggingMessage {
   uid?: number;
 }
 
+export interface FrameStepMessage {
+  type: 'framestep';
+  direction: -1 | 1;
+  uid?: number;
+}
+
+export interface WriteFrameResponseMessage {
+  type: 'writeframe';
+  idx: number;
+  uid?: number;
+  status: 'ok' | 'error';
+  error?: string;
+}
+
 export type MainToWorkerMessage =
   | CreatePipelineMessage
   | ConfigurePipelineMessage
@@ -284,7 +301,9 @@ export type MainToWorkerMessage =
   | ClosePipelineMessage
   | FrameTimingMessage
   | SeekWorkerMessage
-  | DebuggingMessage;
+  | DebuggingMessage
+  | FrameStepMessage
+  | WriteFrameResponseMessage;
 
 // Worker -> Main thread messages
 export interface AddTrackMessage {
@@ -323,6 +342,7 @@ export interface SendEventMessage {
   type: 'sendevent';
   kind: string;
   message?: string;
+  time?: number;
   idx?: number;
   uid?: number;
 }
@@ -341,6 +361,13 @@ export interface AckMessage {
   error?: string;
 }
 
+export interface WriteFrameMessage {
+  type: 'writeframe';
+  idx: number;
+  frame: AudioData;
+  uid?: number;
+}
+
 export type WorkerToMainMessage =
   | AddTrackMessage
   | RemoveTrackMessage
@@ -349,7 +376,8 @@ export type WorkerToMainMessage =
   | LogMessage
   | SendEventMessage
   | StatsMessage
-  | AckMessage;
+  | AckMessage
+  | WriteFrameMessage;
 
 // ============================================================================
 // Stats Types

package/src/players/WebCodecsPlayer/worker/decoder.worker.ts

@@ -20,7 +20,7 @@ import type {
   VideoDecoderInit,
   AudioDecoderInit,
 } from './types';
-import type { TrackInfo, PipelineStats, FrameTrackerStats } from '../types';
+import type { PipelineStats, FrameTrackerStats } from '../types';
 
 // ============================================================================
 // Global State
@@ -139,7 +139,7 @@ let statsTimer: ReturnType<typeof setInterval> | null = null;
 const STATS_INTERVAL_MS = 250;
 
 // Frame dropping stats (Phase 2B)
-let totalFramesDropped = 0;
+let _totalFramesDropped = 0;
 
 // Chrome-recommended decoder queue threshold
 // Per Chrome WebCodecs best practices: drop when decodeQueueSize > 2
@@ -259,6 +259,7 @@ function handleCreate(msg: MainToWorkerMessage & { type: 'create' }): void {
       lastChunkBytes: '' as string,
     },
     optimizeForLatency: opts.optimizeForLatency,
+    payloadFormat: opts.payloadFormat || 'avcc',
   };
 
   pipelines.set(idx, pipeline);
@@ -349,7 +350,10 @@ function configureVideoDecoder(pipeline: PipelineState, description?: Uint8Array
   };
 
   // Pass description directly from WebSocket INIT data (per reference rawws.js line 1052)
-  if (description && description.byteLength > 0) {
+  // For Annex B format (ws/video/h264), SPS/PPS comes inline in the bitstream - skip description
+  if (pipeline.payloadFormat === 'annexb') {
+    log(`Annex B mode - SPS/PPS inline in bitstream, no description needed`);
+  } else if (description && description.byteLength > 0) {
     config.description = description;
     log(`Configuring with description (${description.byteLength} bytes)`);
   } else {
@@ -517,7 +521,7 @@ function resetPipelineAfterError(pipeline: PipelineState): void {
 // ============================================================================
 
 function handleReceive(msg: MainToWorkerMessage & { type: 'receive' }): void {
-  const { idx, chunk, uid } = msg;
+  const { idx, chunk } = msg;
   const pipeline = pipelines.get(idx);
 
   if (!pipeline) {
@@ -555,7 +559,7 @@ function handleReceive(msg: MainToWorkerMessage & { type: 'receive' }): void {
     } else {
       // Drop delta frames when decoder is overwhelmed
       pipeline.stats.framesDropped++;
-      totalFramesDropped++;
+      _totalFramesDropped++;
       logVerbose(`Dropped delta frame @ ${chunk.timestamp / 1000}ms (decoder queue: ${pipeline.decoder.decodeQueueSize})`);
     }
     return;
@@ -583,7 +587,7 @@ function shouldDropFramesDueToDecoderPressure(pipeline: PipelineState): boolean
  * Drop all frames up to the next keyframe in the input queue
  * Called when decoder is severely backed up
  */
-function dropToNextKeyframe(pipeline: PipelineState): number {
+function _dropToNextKeyframe(pipeline: PipelineState): number {
   if (pipeline.inputQueue.length === 0) return 0;
 
   // Find next keyframe in queue
@@ -597,7 +601,7 @@ function dropToNextKeyframe(pipeline: PipelineState): number {
   // Drop all frames before keyframe
   const dropped = pipeline.inputQueue.splice(0, keyframeIdx);
   pipeline.stats.framesDropped += dropped.length;
-  totalFramesDropped += dropped.length;
+  _totalFramesDropped += dropped.length;
 
   log(`Dropped ${dropped.length} frames to next keyframe`, 'warn');
 
@@ -994,13 +998,14 @@ function handleCreateGenerator(msg: MainToWorkerMessage & { type: 'creategenerat
             };
             self.addEventListener('message', handler);
 
-            // Send frame to main thread
-            self.postMessage({
+            // Send frame to main thread (transfer AudioData)
+            const msg = {
               type: 'writeframe',
               idx,
               frame,
               uid: frameUid,
-            }, [frame]);
+            };
+            self.postMessage(msg, { transfer: [frame] });
           });
         },
         close: () => Promise.resolve(),
@@ -1016,6 +1021,7 @@ function handleCreateGenerator(msg: MainToWorkerMessage & { type: 'creategenerat
       self.postMessage(message);
       log(`Set up frame relay for track ${idx} (Safari audio)`);
     }
+    // @ts-ignore - MediaStreamTrackGenerator may not be in standard types
   } else if (typeof MediaStreamTrackGenerator !== 'undefined') {
     // Chrome/Edge: use MediaStreamTrackGenerator in worker
     // @ts-ignore
@@ -1149,9 +1155,10 @@ function handleFrameStep(msg: MainToWorkerMessage & { type: 'framestep' }): void
 
   if (direction > 0) {
     // If we're stepping forward within history (after stepping back), use history
-    if (pipeline.historyCursor !== null && pipeline.historyCursor < pipeline.frameHistory.length - 1) {
-      pipeline.historyCursor += 1;
-      const entry = pipeline.frameHistory[pipeline.historyCursor];
+    const cursor = pipeline.historyCursor;
+    if (cursor !== null && cursor !== undefined && cursor < pipeline.frameHistory.length - 1) {
+      pipeline.historyCursor = cursor + 1;
+      const entry = pipeline.frameHistory[pipeline.historyCursor!];
       const clone = entry ? cloneVideoFrame(entry.frame) : null;
       if (!clone) {
         log(`FrameStep forward: failed to clone frame`);

package/src/players/WebCodecsPlayer/worker/types.ts

@@ -16,6 +16,8 @@ export interface CreateMessage {
   track: TrackInfo;
   opts: {
     optimizeForLatency: boolean;
+    /** Payload format: 'avcc' (length-prefixed) or 'annexb' (start-code delimited) */
+    payloadFormat?: 'avcc' | 'annexb';
   };
   uid: number;
 }
@@ -240,6 +242,8 @@ export interface PipelineState {
     lastChunkBytes: string;
   };
   optimizeForLatency: boolean;
+  /** Payload format: 'avcc' (length-prefixed) or 'annexb' (start-code delimited) */
+  payloadFormat: 'avcc' | 'annexb';
 }
 
 // ============================================================================