[251012] fix: ProductAllSection 렌더링 최적화-1
🕐 커밋 시간: 2025. 10. 12. 08:02:13 📊 변경 통계: • 총 파일: 3개 • 추가: +48줄 • 삭제: -313줄 📝 수정된 파일: ~ com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx ~ com.twin.app.shoptime/src/views/MediaPanel/MediaPanel.jsx 🗑️ 삭제된 파일: - com.twin.app.shoptime/src/views/MediaPanel/README.md 🔧 함수 변경 내용: 📄 com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.jsx (javascript): 🔄 Modified: SpotlightContainerDecorator(), extractProductMeta() 📄 com.twin.app.shoptime/src/views/MediaPanel/README.md (md파일): ❌ Deleted: dispatch(), useDispatch(), useRef() 🔧 주요 변경 내용: • 개발 문서 및 가이드 개선 Performance: 코드 최적화로 성능 개선 기대
This commit is contained in:
@@ -60,16 +60,16 @@ const MediaPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
|
||||
|
||||
// modal/full screen에 따른 일시정지/재생 처리
|
||||
useEffect(() => {
|
||||
console.log('[MediaPanel] ========== isOnTop useEffect ==========');
|
||||
console.log('[MediaPanel] isOnTop:', isOnTop);
|
||||
console.log('[MediaPanel] panelInfo:', JSON.stringify(panelInfo, null, 2));
|
||||
// console.log('[MediaPanel] ========== isOnTop useEffect ==========');
|
||||
// console.log('[MediaPanel] isOnTop:', isOnTop);
|
||||
// console.log('[MediaPanel] panelInfo:', JSON.stringify(panelInfo, null, 2));
|
||||
|
||||
if (panelInfo && panelInfo.modal) {
|
||||
if (!isOnTop) {
|
||||
console.log('[MediaPanel] Not on top - pausing video');
|
||||
// console.log('[MediaPanel] Not on top - pausing video');
|
||||
dispatch(pauseModalMedia());
|
||||
} else if (isOnTop && panelInfo.isPaused) {
|
||||
console.log('[MediaPanel] Back on top - resuming video');
|
||||
// console.log('[MediaPanel] Back on top - resuming video');
|
||||
dispatch(resumeModalMedia());
|
||||
}
|
||||
}
|
||||
@@ -79,10 +79,10 @@ const MediaPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
|
||||
useEffect(() => {
|
||||
if (panelInfo?.modal && videoPlayer.current) {
|
||||
if (panelInfo.isPaused) {
|
||||
console.log('[MediaPanel] Executing pause via videoPlayer.current');
|
||||
// console.log('[MediaPanel] Executing pause via videoPlayer.current');
|
||||
videoPlayer.current.pause();
|
||||
} else if (panelInfo.isPaused === false) {
|
||||
console.log('[MediaPanel] Executing play via videoPlayer.current');
|
||||
// console.log('[MediaPanel] Executing play via videoPlayer.current');
|
||||
videoPlayer.current.play();
|
||||
}
|
||||
}
|
||||
@@ -148,7 +148,7 @@ const MediaPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
|
||||
// 비디오 클릭 시 modal → fullscreen 전환
|
||||
const onVideoClick = useCallback(() => {
|
||||
if (panelInfo.modal) {
|
||||
console.log('[MediaPanel] Video clicked - switching to fullscreen');
|
||||
// console.log('[MediaPanel] Video clicked - switching to fullscreen');
|
||||
dispatch(switchMediaToFullscreen());
|
||||
}
|
||||
}, [dispatch, panelInfo.modal]);
|
||||
@@ -263,7 +263,7 @@ const MediaPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
|
||||
|
||||
const onEnded = useCallback(
|
||||
(e) => {
|
||||
console.log('[MediaPanel] Video ended');
|
||||
// console.log('[MediaPanel] Video ended');
|
||||
// 비디오 종료 시 패널 닫기
|
||||
Spotlight.pause();
|
||||
setTimeout(() => {
|
||||
@@ -288,11 +288,11 @@ const MediaPanel = ({ isTabActivated, panelInfo, isOnTop, spotlightId, ...props
|
||||
setVideoLoaded(false);
|
||||
}, [currentPlayingUrl]);
|
||||
|
||||
console.log('[MediaPanel] ========== Rendering ==========');
|
||||
console.log('[MediaPanel] isOnTop:', isOnTop);
|
||||
console.log('[MediaPanel] panelInfo:', JSON.stringify(panelInfo, null, 2));
|
||||
console.log('[MediaPanel] currentPlayingUrl:', currentPlayingUrl);
|
||||
console.log('[MediaPanel] hasVideoPlayer:', !!videoPlayer.current);
|
||||
// console.log('[MediaPanel] ========== Rendering ==========');
|
||||
// console.log('[MediaPanel] isOnTop:', isOnTop);
|
||||
// console.log('[MediaPanel] panelInfo:', JSON.stringify(panelInfo, null, 2));
|
||||
// console.log('[MediaPanel] currentPlayingUrl:', currentPlayingUrl);
|
||||
// console.log('[MediaPanel] hasVideoPlayer:', !!videoPlayer.current);
|
||||
|
||||
return (
|
||||
<TPanel
|
||||
|
||||
Reference in New Issue
Block a user