browser-emulator: reimplement livekit cli emulated browsers using sockets instead of ffmpeg encoding

This should mean a lot better performance without the transcoding, but requires specific files for it

Author: ivchicano

browser-emulator/docker-compose.dev.yml

@@ -34,6 +34,7 @@ services:
             - ./logs:/app/logs
             - ./mediafiles:/app/mediafiles
             - /var/run/docker.sock:/var/run/docker.sock
+            - /tmp/openvidu-loadtest:/tmp/openvidu-loadtest
         depends_on:
             - livekit-server
         # Override the container command to enable optional debugging

browser-emulator/docker-compose.test.yml

@@ -34,9 +34,10 @@ services:
             - ./logs:/app/logs
             - ./mediafiles:/app/mediafiles
             - /var/run/docker.sock:/var/run/docker.sock
+            - /tmp/openvidu-loadtest:/tmp/openvidu-loadtest
         # Override the container command to enable optional debugging
         # When DOCKER_DEBUG=true the app starts with the Node inspector
-        command: sh -lc "if [ \"${DOCKER_DEBUG:-false}\" = \"true\" ]; then pnpm run test --inspect-brk=0.0.0.0:9229 --no-file-parallelism tests/e2e/emulated-browsers.test.ts; else pnpm run test:coverage; fi"
+        command: sh -lc "if [ \"${DOCKER_DEBUG:-false}\" = \"true\" ]; then pnpm run test:e2e --inspect-brk=0.0.0.0:9229 --no-file-parallelism; else pnpm run test:e2e; fi"
 networks:
     browseremulator:
         name: browseremulator

browser-emulator/docker-compose.yml

@@ -30,6 +30,7 @@ services:
             - ./logs:/app/logs
             - ./mediafiles:/app/mediafiles
             - /var/run/docker.sock:/var/run/docker.sock
+            - /tmp/openvidu-loadtest:/tmp/openvidu-loadtest
 
 networks:
     browseremulator:

browser-emulator/mediafile_generation/generate-mediafiles-qoe.sh

@@ -4,25 +4,32 @@
 # DEFAULT VALUES
 ##################################################################################
 
-VIDEO_SAMPLE_URL=https://archive.org/download/e-dv548_lwe08_christa_casebeer_003.ogg/e-dv548_lwe08_christa_casebeer_003.mp4
+# Big Buck Bunny is the default source video
+BUNNY_ZIP_URL="https://download.blender.org/demo/movies/BBB/bbb_sunflower_1080p_60fps_normal.mp4.zip"
+BUNNY_ZIP_FILE="bbb_sunflower_1080p_60fps_normal.mp4.zip"
+BUNNY_VIDEO_FILE="bbb_sunflower_1080p_60fps_normal.mp4"
+INTERVIEW_VIDEO_URL="https://archive.org/download/e-dv548_lwe08_christa_casebeer_003.ogg/e-dv548_lwe08_christa_casebeer_003.mp4"
+
+VIDEO_SAMPLE_URL="$BUNNY_VIDEO_FILE"  # Default to bunny (will be downloaded if needed)
 WIDTH=640
 HEIGHT=480
-VIDEO_DURATION=00:00:30
+VIDEO_DURATION=00:00:05
+START_POSITION=00:00:52
 PADDING_DURATION_SEC=1
 AUDIO_SAMPLE_RATE_HZ=48000
 TONE_FREQUENCY_HZ=1000
 AUDIO_CHANNELS_NUMBER=2
 FPS=30
+USE_BUNNY=true  # Bunny is default
 FFMPEG_LOG="-loglevel error"
-TARGET_VIDEO=./test.y4m
-TARGET_AUDIO=./test.wav
 GENERATE_DEFAULT_REF=false
 DEFAULT_VIDEO_REF=./test-no-padding.yuv
 DEFAULT_AUDIO_REF=./test-no-padding.wav
 FONT=./arial.ttf
 CLEANUP=true
 GET_ORIGINAL_STATS=false
-USAGE="Usage: `basename $0` [-d=duration] [-p=padding_duration_sec] [--game] [--generate_default_ref] [--no_cleanup] [--clean] [-v=video_url] [-w=width] [-h=height] [-a=audio_url] [-f=fps] [--original]"
+GENERATE_STREAMING=true
+USAGE="Usage: $(basename $0) [-d=duration] [-p=padding_duration_sec] [--game] [--interview] [--generate_default_ref] [--no_cleanup] [--clean] [--no-streaming] [-v=video_url] [-w=width] [-h=height] [-a=audio_url] [-f=fps] [--original]"
 
 ##################################################################################
 # FUNCTIONS
@@ -120,6 +127,16 @@ for i in "$@"; do
    case $i in
       --game)
       VIDEO_SAMPLE_URL=https://ia802808.us.archive.org/6/items/ForniteBattle8/fornite%20battle%202.mp4
+      USE_BUNNY=false
+      VIDEO_DURATION=00:00:30
+      START_POSITION=00:00:00
+      shift
+      ;;
+      --interview)
+      VIDEO_SAMPLE_URL="$INTERVIEW_VIDEO_URL"
+      USE_BUNNY=false
+      VIDEO_DURATION=00:00:15
+      START_POSITION=00:00:00
       shift
       ;;
       --generate_default_ref)
@@ -143,6 +160,10 @@ for i in "$@"; do
       exit 0
       shift
       ;;
+      --no-streaming)
+      GENERATE_STREAMING=false
+      shift
+      ;;
       -v=*)
       VIDEO_SAMPLE_URL="${i#*=}"
       shift
@@ -178,17 +199,63 @@ done
 # INIT
 ##################################################################################
 
+# Download Big Buck Bunny if it's the source and doesn't exist yet
+if [ "$USE_BUNNY" = true ]; then
+   # Download zip if not exists
+   if [ ! -f "$BUNNY_ZIP_FILE" ] && [ ! -f "$BUNNY_VIDEO_FILE" ]; then
+      echo "Downloading Big Buck Bunny video from blender.org..."
+      if command -v curl &> /dev/null; then
+         curl -L -o "$BUNNY_ZIP_FILE" "$BUNNY_ZIP_URL" --progress-bar
+      elif command -v wget &> /dev/null; then
+         wget -O "$BUNNY_ZIP_FILE" "$BUNNY_ZIP_URL"
+      else
+         echo "Error: curl or wget required"
+         exit 1
+      fi
+   fi
+   
+   # Unzip if video file doesn't exist
+   if [ ! -f "$BUNNY_VIDEO_FILE" ]; then
+      echo "Extracting Big Buck Bunny video from zip..."
+      unzip -o "$BUNNY_ZIP_FILE"
+   fi
+   
+   VIDEO_SAMPLE_URL="$BUNNY_VIDEO_FILE"
+fi
+
+# Determine media type from source URL
+case "$VIDEO_SAMPLE_URL" in
+   *christa_casebeer*|*interview*)
+      MEDIA_TYPE="interview"
+      ;;
+   *ForniteBattle*)
+      MEDIA_TYPE="game"
+      ;;
+   *bbb_sunflower*|*BBB*)
+      MEDIA_TYPE="bunny"
+      ;;
+   *)
+      MEDIA_TYPE="custom"
+      ;;
+esac
+
+# Output filenames using consistent naming: {type}_{height}p_{fps}fps.{extension}
+BASE_NAME="${MEDIA_TYPE}_${HEIGHT}p_${FPS}fps"
+TARGET_VIDEO="./${BASE_NAME}.y4m"
+TARGET_AUDIO="./${MEDIA_TYPE}.wav"
+STREAMING_VIDEO="./${BASE_NAME}.h264"
+STREAMING_AUDIO="./${MEDIA_TYPE}.ogg"
 
 ##########################
 # 1. Download video sample
 ##########################
 VIDEO_SAMPLE_NAME=$(echo ${VIDEO_SAMPLE_URL##*/} | sed -e 's/%20/ /g')
 
 if [ ! -f "$VIDEO_SAMPLE_NAME" ]; then
-    echo "Content video ($VIDEO_SAMPLE_NAME) not exits ... downloading"
+    echo "Content video ($VIDEO_SAMPLE_NAME) not exists ... downloading"
     wget $VIDEO_SAMPLE_URL
 else
-    echo "Content video ($VIDEO_SAMPLE_NAME) already exits"
+    echo "Content video ($VIDEO_SAMPLE_NAME) already exists"
 fi
 if [ -z "$FPS" ]; then
 	FPS=$(ffprobe -v error -select_streams v -show_entries stream=r_frame_rate -of default=noprint_wrappers=1:nokey=1 "$VIDEO_SAMPLE_NAME")
@@ -208,7 +275,7 @@ fi
 #######################
 if [ "$GET_ORIGINAL_STATS" = false ]; then
 	echo "Cutting original video (duration $VIDEO_DURATION)"
-	ffmpeg $FFMPEG_LOG -y -i "$VIDEO_SAMPLE_NAME" -ss 00:00:00 -t $VIDEO_DURATION -vf scale="$WIDTH:$HEIGHT",setsar=1:1 -r $FPS test-no-frame-number.mp4
+	ffmpeg $FFMPEG_LOG -y -i "$VIDEO_SAMPLE_NAME" -ss $START_POSITION -t $VIDEO_DURATION -vf scale="$WIDTH:$HEIGHT",setsar=1:1 -r $FPS test-no-frame-number.mp4
 	OUTPUT="test-no-frame-number.mp4"
 fi
 
@@ -349,7 +416,59 @@ if $GENERATE_DEFAULT_REF; then
 fi
 
 ################################
-# 9. Delete temporal video files
+# 9. Generate streaming files (H.264 + Opus Ogg)
+################################
+if $GENERATE_STREAMING; then
+   echo "=========================================="
+   echo "Generating streaming media files for LiveKit"
+   echo "=========================================="
+   
+   # Get FPS as integer for keyint calculation
+   FPS_INT=$(echo "$FPS" | awk '{if ($1 ~ /\//) {split($1, a, "/"); print a[1]/a[2]} else {print $1}}' | awk '{printf "%d", $1}')
+   if [ -z "$FPS_INT" ] || [ "$FPS_INT" -le 0 ]; then
+      FPS_INT=30
+   fi
+   
+   # Generate H.264 Annex B video from test.mp4 (same content as QoE Y4M)
+   echo "Generating H.264 video ($STREAMING_VIDEO)..."
+   ffmpeg $FFMPEG_LOG -y -i test.mp4 \
+     -c:v libx264 -preset veryfast -profile:v baseline \
+     -pix_fmt yuv420p \
+     -x264-params "keyint=$((FPS_INT * 4)):min-keyint=$((FPS_INT * 4))" \
+     -bf 0 -b:v 2M \
+     -an \
+     -f h264 \
+     "$STREAMING_VIDEO"
+   
+   echo "  -> $(ls -lh "$STREAMING_VIDEO" 2>/dev/null | awk '{print $5}' || echo 'not found')"
+   
+   # Generate Opus Ogg audio from test-audio-raw.wav (same content as QoE WAV)
+   echo "Generating Opus audio ($STREAMING_AUDIO)..."
+   ffmpeg $FFMPEG_LOG -y -i test-audio-raw.wav \
+     -c:a libopus -page_duration 20000 \
+     -ar $AUDIO_SAMPLE_RATE_HZ -ac $AUDIO_CHANNELS_NUMBER \
+     -f opus \
+     "$STREAMING_AUDIO"
+   
+   echo "  -> $(ls -lh "$STREAMING_AUDIO" 2>/dev/null | awk '{print $5}' || echo 'not found')"
+   
+   echo ""
+   echo "Streaming files generated:"
+   echo "  Video: $(pwd)/$STREAMING_VIDEO"
+   echo "  Audio: $(pwd)/$STREAMING_AUDIO"
+   echo ""
+   echo "These files are compatible with LiveKit CLI's h264:// and opus:// protocols."
+   echo "=========================================="
+
+   echo ""
+   echo "=========================================="
+   echo "All generated files:"
+   ls -lh ./${BASE_NAME}.* 2>/dev/null | awk '{print "  " $NF " (" $5 ")"}'
+   echo "=========================================="
+fi
+
+################################
+# 10. Delete temporal video files
 ################################
 if $CLEANUP; then
    cleanup

browser-emulator/mediafile_generation/upload-to-s3.sh

@@ -50,10 +50,10 @@ $AWS_CLI sts get-caller-identity >/dev/null 2>&1 ||
 # --- Main ---------------------------------------------------------------------
 
 # Find .y4m and .wav files in the current directory (non-recursive), safely handling spaces
-mapfile -d '' FILES < <(find . -maxdepth 1 -type f \( -iname "*.y4m" -o -iname "*.wav" \) -print0)
+mapfile -d '' FILES < <(find . -maxdepth 1 -type f \( -iname "*.y4m" -o -iname "*.wav" -o -iname "*.h264" -o -iname "*.ogg" \) -print0)
 
 if [[ ${#FILES[@]} -eq 0 ]]; then
-    echo "No .y4m or .wav files found in the current directory."
+    echo "No valid files found in the current directory."
     exit 0
 fi
 

browser-emulator/src/app.ts

@@ -20,6 +20,7 @@ async function cleanup() {
 	const emulatedFilePublishStreamService = container.resolve(
 		'emulatedFilePublishStreamService',
 	);
+	const socketWriterService = container.resolve('socketWriterService');
 	try {
 		await browserManager.clean();
 	} catch (err) {
@@ -36,6 +37,7 @@ async function cleanup() {
 		scriptRunnerService.killAllDetached(),
 		instanceService.removeMetricBeat(),
 		emulatedFilePublishStreamService.stopPublishing(),
+		socketWriterService.stopAllWriters(),
 	]);
 	console.log('Cleanup finished');
 }

browser-emulator/src/container.ts

@@ -28,6 +28,8 @@ import { FakeMediaDevicesService } from './services/fake-media/fake-media-device
 import { QoeAnalyzerService } from './services/qoe-analysis/qoe-analyzer.service.ts';
 import { QoeCommandRunner } from './services/qoe-analysis/qoe-command-runner.ts';
 import { EmulatedFilePublishStreamService } from './services/browser/emulated/emulated-file-publish-stream.service.ts';
+import { SocketWriterService } from './services/streaming/socket-writer.service.ts';
+import { SocketWriterHealthService } from './services/streaming/socket-writer-health.service.ts';
 
 // Define the container interface for type safety
 export interface DIContainer {
@@ -36,6 +38,8 @@ export interface DIContainer {
 	realBrowserService: RealBrowserService;
 	emulatedBrowserService: EmulatedBrowserService;
 	emulatedFilePublishStreamService: EmulatedFilePublishStreamService;
+	socketWriterService: SocketWriterService;
+	healthService: SocketWriterHealthService;
 	instanceService: InstanceService;
 	elasticSearchService: ElasticSearchService;
 	wsService: WsService;
@@ -95,6 +99,8 @@ export async function configureContainer(): Promise<
 		realBrowserService: asClass(RealBrowserService).singleton(),
 		emulatedBrowserService: asClass(EmulatedBrowserService).singleton(),
 		browserManagerService: asClass(BrowserManagerService).singleton(),
+		socketWriterService: asClass(SocketWriterService).singleton(),
+		healthService: asClass(SocketWriterHealthService).singleton(),
 		emulatedFilePublishStreamService: asClass(
 			EmulatedFilePublishStreamService,
 		).singleton(),

browser-emulator/src/repositories/files/local-files.repository.ts

@@ -15,6 +15,8 @@ export class LocalFilesRepository {
 
 	private _fakevideo: string | undefined;
 	private _fakeaudio: string | undefined;
+	private _fakevideoStreaming: string | undefined;
+	private _fakeaudioStreaming: string | undefined;
 
 	constructor() {
 		this.createNeededDirectories();
@@ -28,6 +30,38 @@ export class LocalFilesRepository {
 		return this._fakeaudio;
 	}
 
+	/**
+	 * Get path to H.264 streaming video file (for Unix socket streaming)
+	 */
+	public get fakevideoStreaming(): string | undefined {
+		return this._fakevideoStreaming;
+	}
+
+	/**
+	 * Get path to Opus Ogg streaming audio file (for Unix socket streaming)
+	 */
+	public get fakeaudioStreaming(): string | undefined {
+		return this._fakeaudioStreaming;
+	}
+
+	/**
+	 * Check if streaming media files exist
+	 */
+	public async existStreamingMediaFiles(): Promise<boolean> {
+		if (!this._fakevideoStreaming || !this._fakeaudioStreaming) {
+			return false;
+		}
+		try {
+			await Promise.all([
+				fsPromises.access(this._fakevideoStreaming, fs.constants.F_OK),
+				fsPromises.access(this._fakeaudioStreaming, fs.constants.F_OK),
+			]);
+			return true;
+		} catch {
+			return false;
+		}
+	}
+
 	private createNeededDirectories() {
 		const requiredDirs = [
 			LocalFilesRepository.FULLSCREEN_RECORDING_DIR,
@@ -56,6 +90,22 @@ export class LocalFilesRepository {
 		return filePaths;
 	}
 
+	public async downloadStreamingFiles(
+		videoFile: string,
+		videoUrl: string,
+		audioFile: string,
+		audioUrl: string,
+	): Promise<string[]> {
+		const filePaths = await Promise.all([
+			this.downloadFile(videoFile, videoUrl),
+			this.downloadFile(audioFile, audioUrl),
+		]);
+		this._fakevideoStreaming = filePaths[0];
+		this._fakeaudioStreaming = filePaths[1];
+
+		return filePaths;
+	}
+
 	private async downloadFile(name: string, fileUrl: string): Promise<string> {
 		const filePath = LocalFilesRepository.MEDIAFILES_DIR + '/' + name;
 		try {