mirror of
https://gitcode.com/GitHub_Trending/ji/jitsi-meet.git
synced 2025-12-30 03:12:29 +00:00
6deb0a6385
Large video was being updated through scheduleLargeVideoUpdate even when the large video container was hidden via CSS. This occurred in multiple layout modes: tile view, stage filmstrip (with 2+ participants), and etherpad editing. These updates caused expensive operations including setting video streams, managing track listeners, updating avatars, and running show/hide animations - all wasted CPU cycles since the container wasn't visible. The fix introduces a centralized shouldHideLargeVideo() function that checks all cases where the large video container is hidden. This function is used in selectParticipantInLargeVideo() to guard to not update the participant id. A state listener monitors transitions from hidden to visible states and ensures the large video participant id is properly updated when the container becomes visible again and set to undefined when large video is hidden. This improves performance by eliminating unnecessary video element manipulation and handler execution across all layout modes where large video is not displayed.
27 lines
1.0 KiB
TypeScript
27 lines
1.0 KiB
TypeScript
import StateListenerRegistry from '../base/redux/StateListenerRegistry';
|
|
|
|
import { SELECT_LARGE_VIDEO_PARTICIPANT } from './actionTypes';
|
|
import { selectParticipantInLargeVideo } from './actions.any';
|
|
import { shouldHideLargeVideo } from './functions';
|
|
|
|
/**
|
|
* Updates the large video when transitioning from a hidden state to visible state.
|
|
* This ensures the large video is properly updated when exiting tile view, stage filmstrip,
|
|
* whiteboard, or etherpad editing modes.
|
|
*/
|
|
StateListenerRegistry.register(
|
|
/* selector */ state => shouldHideLargeVideo(state),
|
|
/* listener */ (isHidden, { dispatch }) => {
|
|
// When transitioning from hidden to visible state, select participant (because currently it is undefined).
|
|
// Otherwise set it to undefined because we don't show the large video.
|
|
if (!isHidden) {
|
|
dispatch(selectParticipantInLargeVideo());
|
|
} else {
|
|
dispatch({
|
|
type: SELECT_LARGE_VIDEO_PARTICIPANT,
|
|
participantId: undefined
|
|
});
|
|
}
|
|
}
|
|
);
|