[251125] fix: VideoPlayer 메모리최적화 - 1

🕐 커밋 시간: 2025. 11. 25. 10:41:26

📊 변경 통계:
  • 총 파일: 3개
  • 추가: +101줄
  • 삭제: -76줄

📝 수정된 파일:
  ~ com.twin.app.shoptime/src/components/VideoPlayer/TReactPlayer.jsx
  ~ com.twin.app.shoptime/src/components/VideoPlayer/VideoPlayer.js
  ~ com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx

🔧 주요 변경 내용:
  • UI 컴포넌트 아키텍처 개선
  • 중간 규모 기능 개선
  • 코드 정리 및 최적화

com.twin.app.shoptime/src/views/PlayerPanel/PlayerPanel.jsx

@@ -2002,14 +2002,17 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
         file: {
           attributes: {
             crossOrigin: 'true',
+            preload: 'metadata',
           },
           tracks: [{ kind: 'subtitles', src: currentSubtitleBlob, default: true }],
           hlsOptions: {
-            // 버퍼 길이를 늘려 재버퍼링 감소
-            maxBufferLength: 60,
-            maxMaxBufferLength: 180,
-            liveSyncDuration: 16,
-            liveMaxLatencyDuration: 32,
+            // 버퍼 길이를 30초 기준으로 설정
+            maxBufferLength: 30,
+            maxMaxBufferLength: 90,
+            backBufferLength: 0,
+            maxBufferSize: 30 * 1000 * 1000, // 최대 버퍼 크기 30MB
+            liveSyncDuration: 8,
+            liveMaxLatencyDuration: 16,
           },
         },
         youtube: YOUTUBECONFIG,
@@ -2018,11 +2021,16 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
       return {
         youtube: YOUTUBECONFIG,
         file: {
+          attributes: {
+            preload: 'metadata',
+          },
           hlsOptions: {
-            maxBufferLength: 60,
-            maxMaxBufferLength: 180,
-            liveSyncDuration: 16,
-            liveMaxLatencyDuration: 32,
+            maxBufferLength: 30,
+            maxMaxBufferLength: 90,
+            backBufferLength: 0,
+            maxBufferSize: 30 * 1000 * 1000,
+            liveSyncDuration: 8,
+            liveMaxLatencyDuration: 16,
           },
         },
       };
@@ -2884,7 +2892,7 @@ const PlayerPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
             disabled={panelInfo.modal}
             onEnded={onEnded}
             noAutoPlay={cannotPlay}
-            autoCloseTimeout={3000}
+            autoCloseTimeout={6000}
             onBackButton={onClickBack}
             spotlightDisabled={panelInfo.modal}
             isYoutube={isYoutube}