From cc15a06ffbe5ef6b761cacaf5a0b3d0e03d6e986 Mon Sep 17 00:00:00 2001
From: Izan Gil <66965250+SrIzan10@users.noreply.github.com>
Date: Mon, 26 Jan 2026 16:18:36 +0100
Subject: [PATCH] fix: production latency (hopefully)

---
 apps/web/package.json                                  |  1 +
 .../src/components/app/StreamPlayer/StreamPlayer.tsx   |  5 +++++
 dev/docker-compose.yml                                 |  9 +++++----
 dev/mediamtx.yml                                       | 10 ++++++++--
 pnpm-lock.yaml                                         |  3 +++
 5 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/apps/web/package.json b/apps/web/package.json
index bb3cff4..769fa52 100644
--- a/apps/web/package.json
+++ b/apps/web/package.json
@@ -49,6 +49,7 @@
     "cmdk": "1.0.0",
     "date-fns": "^4.1.0",
     "hls-video-element": "^1.5.0",
+    "hls.js": "^1.6.15",
     "lucia": "^3.2.2",
     "lucide-react": "^0.473.0",
     "media-chrome": "^4.8.0",
diff --git a/apps/web/src/components/app/StreamPlayer/StreamPlayer.tsx b/apps/web/src/components/app/StreamPlayer/StreamPlayer.tsx
index d03b720..bb1b983 100644
--- a/apps/web/src/components/app/StreamPlayer/StreamPlayer.tsx
+++ b/apps/web/src/components/app/StreamPlayer/StreamPlayer.tsx
@@ -35,6 +35,11 @@ export default function StreamPlayer() {
         },
         lowLatencyMode: true,
         debug: process.env.NODE_ENV === 'development',
+        backBufferLength: 90,
+        enableWorker: true,
+        maxLiveSyncPlaybackRate: 1.5,
+        liveSyncDurationCount: 2,
+        liveMaxLatencyDurationCount: 4,
       };
 
       // @ts-ignore
diff --git a/dev/docker-compose.yml b/dev/docker-compose.yml
index 7b69991..01afc34 100644
--- a/dev/docker-compose.yml
+++ b/dev/docker-compose.yml
@@ -17,9 +17,10 @@ services:
       - 6379:6379
   mediamtx:
     image: bluenviron/mediamtx:latest
-    ports:
-      - 8890:8890/udp
-      - 8891:8888
-      - 9997:9997
+    network_mode: "host"
+    # ports:
+    #   - 8890:8890/udp
+    #   - 8891:8888
+    #   - 9997:9997
     volumes:
       - ./mediamtx.yml:/mediamtx.yml
\ No newline at end of file
diff --git a/dev/mediamtx.yml b/dev/mediamtx.yml
index 713b91d..4d0948e 100644
--- a/dev/mediamtx.yml
+++ b/dev/mediamtx.yml
@@ -5,9 +5,15 @@ paths:
 srt: yes
 srtAddress: :8890
 
+# HLS Configuration - Low Latency HLS (LL-HLS)
 hls: yes
+hlsAddress: :8891
+hlsSegmentCount: 7
+hlsSegmentDuration: 500ms
+hlsPartDuration: 200ms
+hlsMuxerCloseAfter: 5s
 
 authMethod: http
-authHTTPAddress: http://192.168.1.47:3000/api/mediamtx/publish
+authHTTPAddress: http://localhost:3000/api/mediamtx/publish
 
-api: yes
\ No newline at end of file
+api: yes
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b80ac4e..b54e4e4 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -177,6 +177,9 @@ importers:
       hls-video-element:
         specifier: ^1.5.0
         version: 1.5.10
+      hls.js:
+        specifier: ^1.6.15
+        version: 1.6.15
       lucia:
         specifier: ^3.2.2
         version: 3.2.2