console logs

packages/react-components/src/components/LocalVideoTile.tsx

@@ -14,6 +14,9 @@ import {
 import { VideoTile, VideoTileStylesProps } from './VideoTile';
 /* @conditional-compile-remove(raise-hand) */
 import { RaisedHand } from '../types';
+
+let i = 0;
+
 /**
  * A memoized version of VideoTile for rendering local participant.
  *
@@ -64,6 +67,8 @@ export const _LocalVideoTile = React.memo(
       raisedHand
     } = props;
 
+    console.log('LocalVideoTile re-rendered', i++);
+
     const localVideoStreamProps: LocalVideoStreamLifecycleMaintainerProps = useMemo(
       () => ({
         isMirrored: localVideoViewOptions?.isMirrored,

packages/react-components/src/components/RemoteVideoTile.tsx

@@ -28,6 +28,8 @@ import { _formatString } from '@internal/acs-ui-common';
 /* @conditional-compile-remove(hide-attendee-name) */
 import { useLocale } from '../localization';
 
+let i = 0;
+
 /**
  * A memoized version of VideoTile for rendering remote participants. React.memo is used for a performance
  * boost by memoizing the same rendered component to avoid rerendering a VideoTile when its position in the
@@ -87,6 +89,8 @@ export const _RemoteVideoTile = React.memo(
       strings
     } = props;
 
+    console.log('RemoteVideoTile re-rendered', i++);
+
     const remoteVideoStreamProps: RemoteVideoStreamLifecycleMaintainerProps = useMemo(
       () => ({
         isMirrored: remoteVideoViewOptions?.isMirrored,

packages/react-components/src/components/VideoGallery.tsx

@@ -314,6 +314,9 @@ export interface VideoTileDrawerMenuProps {
    */
   hostId?: string;
 }
+
+let i = 0;
+
 /**
  * VideoGallery represents a layout of video tiles for a specific call.
  * It displays a {@link VideoTile} for the local user as well as for each remote participant who has joined the call.
@@ -353,6 +356,8 @@ export const VideoGallery = (props: VideoGalleryProps): JSX.Element => {
     localVideoTileSize = 'followDeviceOrientation'
   } = props;
 
+  console.log('VideoGallery re-rendered', i++);
+
   const ids = useIdentifiers();
   const theme = useTheme();
   const localeStrings = useLocale().strings.videoGallery;