ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[Perf] Story Toggler: Avoid expensive global updates on users and chats

Browse Source
This commit is contained in:
Alexander Zinchuk 2024-09-06 15:42:44 +02:00
parent 90adfdf5e0
commit 1e4950c7e3
1 changed files with 7 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/components/story/StoryToggler.tsx
View File

@ -1,13 +1,10 @@
import React, { memo, useEffect, useMemo } from '../../lib/teact/teact'; import React, { memo, useEffect, useMemo } from '../../lib/teact/teact';
import { getActions, withGlobal } from '../../global'; import { getActions, getGlobal, withGlobal } from '../../global';
import type { ApiChat, ApiUser } from '../../api/types';
import type { GlobalState } from '../../global/types'; import type { GlobalState } from '../../global/types';
import { ANIMATION_END_DELAY, PREVIEW_AVATAR_COUNT } from '../../config'; import { ANIMATION_END_DELAY, PREVIEW_AVATAR_COUNT } from '../../config';
import { import { selectIsForumPanelOpen, selectPerformanceSettingsValue, selectTabState } from '../../global/selectors';
selectIsForumPanelOpen, selectPerformanceSettingsValue, selectTabState,
} from '../../global/selectors';
import buildClassName from '../../util/buildClassName'; import buildClassName from '../../util/buildClassName';
import { animateClosing, animateOpening, ANIMATION_DURATION } from './helpers/ribbonAnimation'; import { animateClosing, animateOpening, ANIMATION_DURATION } from './helpers/ribbonAnimation';
@ -31,8 +28,6 @@ interface StateProps {
isShown: boolean; isShown: boolean;
isForumPanelOpen?: boolean; isForumPanelOpen?: boolean;
withAnimation?: boolean; withAnimation?: boolean;
usersById: Record<string, ApiUser>;
chatsById: Record<string, ApiChat>;
peerStories: GlobalState['stories']['byPeerId']; peerStories: GlobalState['stories']['byPeerId'];
} }
@ -41,8 +36,6 @@ const PRELOAD_PEERS = 5;
function StoryToggler({ function StoryToggler({
currentUserId, currentUserId,
orderedPeerIds, orderedPeerIds,
usersById,
chatsById,
canShow, canShow,
isShown, isShown,
isForumPanelOpen, isForumPanelOpen,
@ -55,6 +48,10 @@ function StoryToggler({
const lang = useOldLang(); const lang = useOldLang();
const peers = useMemo(() => { const peers = useMemo(() => {
// No need for expensive global updates on users, so we avoid them
const usersById = getGlobal().users.byId;
const chatsById = getGlobal().chats.byId;
if (orderedPeerIds.length === 1) { if (orderedPeerIds.length === 1) {
return [usersById[orderedPeerIds[0]] || chatsById[orderedPeerIds[0]]]; return [usersById[orderedPeerIds[0]] || chatsById[orderedPeerIds[0]]];
} }
@ -64,7 +61,7 @@ function StoryToggler({
.filter((peer) => peer && peer.id !== currentUserId) .filter((peer) => peer && peer.id !== currentUserId)
.slice(0, PREVIEW_AVATAR_COUNT) .slice(0, PREVIEW_AVATAR_COUNT)
.reverse(); .reverse();
}, [currentUserId, orderedPeerIds, usersById, chatsById]); }, [currentUserId, orderedPeerIds]);
const closeFriends = useMemo(() => { const closeFriends = useMemo(() => {
if (!peers?.length) return {}; if (!peers?.length) return {};
@ -144,8 +141,6 @@ export default memo(withGlobal<OwnProps>((global, { isArchived }): StateProps =>
isShown: isArchived ? !isArchivedRibbonShown : !isRibbonShown, isShown: isArchived ? !isArchivedRibbonShown : !isRibbonShown,
isForumPanelOpen, isForumPanelOpen,
withAnimation, withAnimation,
usersById: global.users.byId,
chatsById: global.chats.byId,
peerStories: byPeerId, peerStories: byPeerId,
}; };
})(StoryToggler)); })(StoryToggler));