perf: prevent unnecessary re-renders from RPC client state changes

This commit is contained in:
plebeius
2026-01-14 15:05:45 +01:00
parent 91cd84819d
commit 3799dccd88
8 changed files with 168 additions and 26 deletions
+10 -3
View File
@@ -1,7 +1,8 @@
import { useEffect, useMemo, useRef, useState, useCallback } from 'react';
import { Link, useLocation, useNavigationType, useParams } from 'react-router-dom';
import { Trans, useTranslation } from 'react-i18next';
import { Comment, useAccount, useFeed, useSubplebbit, useBlock, useAccountComments } from '@plebbit/plebbit-react-hooks';
import { Comment, useAccount, useFeed, useBlock, useAccountComments } from '@plebbit/plebbit-react-hooks';
import { useSubplebbitField } from '../../hooks/use-stable-subplebbit';
import { Virtuoso, VirtuosoHandle, StateSnapshot } from 'react-virtuoso';
import { getCommentMediaInfo, getHasThumbnail } from '../../lib/utils/media-utils';
import useCatalogFeedRows from '../../hooks/use-catalog-feed-rows';
@@ -479,8 +480,14 @@ const Catalog = ({ feedCacheKey, viewType, boardIdentifier: boardIdentifierProp,
}
}, [reset, setResetFunction, isVisible]);
const subplebbit = useSubplebbit({ subplebbitAddress });
const { error, shortAddress, state, title } = subplebbit || {};
// Use stable field selectors to avoid re-renders from updatingState changes
const error = useSubplebbitField(subplebbitAddress, (sub) => sub?.error);
const shortAddress = useSubplebbitField(subplebbitAddress, (sub) => sub?.shortAddress);
const title = useSubplebbitField(subplebbitAddress, (sub) => sub?.title);
// Derive state from updatedAt field - if updatedAt exists, state is 'succeeded'
const updatedAt = useSubplebbitField(subplebbitAddress, (sub) => sub?.updatedAt);
const state = updatedAt ? 'succeeded' : 'fetching-ipns';
const { blocked, unblock } = useBlock({ address: subplebbitAddress });
const feedLength = feed.length;