External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files
src/components/subplebbit-stats/subplebbit-stats.tsx
+10 -7
View File
@@ -1,7 +1,8 @@
import { useParams } from 'react-router-dom';
import { Trans, useTranslation } from 'react-i18next';
import { useAccountComment, useSubplebbitStats } from '@plebbit/plebbit-react-hooks';
import { useAccountComment } from '@plebbit/plebbit-react-hooks';
import { useSubplebbitField } from '../../hooks/use-stable-subplebbit';
import { useStableSubplebbitStats } from '../../hooks/use-stable-subplebbit-stats';
import useSubplebbitsPagesStore from '@plebbit/plebbit-react-hooks/dist/stores/subplebbits-pages';
import useSubplebbitStatsVisibilityStore from '../../stores/use-subplebbit-stats-visibility-store';
import { useResolvedSubplebbitAddress } from '../../hooks/use-resolved-subplebbit-address';
@@ -19,7 +20,9 @@ const SubplebbitStats = () => {
const address = useSubplebbitField(subplebbitAddress, (subplebbit) => subplebbit?.address);
const createdAt = useSubplebbitField(subplebbitAddress, (subplebbit) => subplebbit?.createdAt);
let stats = useSubplebbitStats({ subplebbitAddress: address });
// Use stable stats hook that doesn't depend on useSubplebbit internally
const stats = useStableSubplebbitStats(address);
const { hiddenStats, toggleVisibility } = useSubplebbitStatsVisibilityStore();
const isHidden = hiddenStats[address];
@@ -51,13 +54,13 @@ const SubplebbitStats = () => {
<td>
<Trans
i18nKey='board_stats_hour'
values={{ userCount: stats.hourActiveUserCount ?? '?', postCount: stats.hourPostCount ?? '?' }}
values={{ userCount: stats?.hourActiveUserCount ?? '?', postCount: stats?.hourPostCount ?? '?' }}
components={{ 1: <span key='hour-stat-value' className={styles.statValue} /> }}
/>
{' / '}
<Trans
i18nKey='board_stats_day'
values={{ userCount: stats.dayActiveUserCount ?? '?', postCount: stats.dayPostCount ?? '?' }}
values={{ userCount: stats?.dayActiveUserCount ?? '?', postCount: stats?.dayPostCount ?? '?' }}
components={{ 1: <span key='day-stat-value' className={styles.statValue} /> }}
/>
</td>
@@ -66,13 +69,13 @@ const SubplebbitStats = () => {
<td>
<Trans
i18nKey='board_stats_week'
values={{ userCount: stats.weekActiveUserCount ?? '?', postCount: stats.weekPostCount ?? '?' }}
values={{ userCount: stats?.weekActiveUserCount ?? '?', postCount: stats?.weekPostCount ?? '?' }}
components={{ 1: <span key='week-stat-value' className={styles.statValue} /> }}
/>
{' / '}
<Trans
i18nKey='board_stats_month'
values={{ userCount: stats.monthActiveUserCount ?? '?', postCount: stats.monthPostCount ?? '?' }}
values={{ userCount: stats?.monthActiveUserCount ?? '?', postCount: stats?.monthPostCount ?? '?' }}
components={{ 1: <span key='month-stat-value' className={styles.statValue} /> }}
/>
</td>
@@ -83,7 +86,7 @@ const SubplebbitStats = () => {
{' / '}
<Trans
i18nKey='board_stats_all'
values={{ userCount: stats.allActiveUserCount ?? '?', postCount: stats.allPostCount ?? '?' }}
values={{ userCount: stats?.allActiveUserCount ?? '?', postCount: stats?.allPostCount ?? '?' }}
components={{ 1: <span key='all-stat-value' className={styles.statValue} /> }}
/>
</td>