mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
perf(bundle): replace plebbit-js imports with local utility, split chunks, fix CLS and rerenders
Eliminate direct @plebbit/plebbit-js (8.7MB) imports from all UI components by replacing Plebbit.getShortAddress() with a local get-short-address utility. Add Vite manual chunks for plebbit-js, plebbit-react-hooks, and react-spring/use-gesture. Fix catalog CLS by matching skeleton to wrapper dimensions. Lazy-load ChallengeModal and ReplyModal. Add failed-URL cache to useFetchGifFirstFrame, optimize useHide selector, and memoize useFeed options in mod-queue.
This commit is contained in:
@@ -3,7 +3,7 @@ import { Trans, useTranslation } from 'react-i18next';
|
||||
import { Link, useLocation, useNavigationType, useParams } from 'react-router-dom';
|
||||
import { Virtuoso, VirtuosoHandle, StateSnapshot } from 'react-virtuoso';
|
||||
import { Comment, useEditedComment, useReplies, useAccount, useAccountComment } from '@plebbit/plebbit-react-hooks';
|
||||
import Plebbit from '@plebbit/plebbit-js';
|
||||
import getShortAddress from '../../lib/get-short-address';
|
||||
import styles from '../../views/post/post.module.css';
|
||||
import { CommentMediaInfo, getDisplayMediaInfoType, getHasThumbnail, getMediaDimensions } from '../../lib/utils/media-utils';
|
||||
import { hashStringToColor, getTextColorForBackground } from '../../lib/utils/post-utils';
|
||||
@@ -211,7 +211,7 @@ const PostInfo = ({
|
||||
const alertThresholdSeconds = getAlertThresholdSeconds();
|
||||
const isOverThreshold = isAwaitingApproval && timeWaiting > alertThresholdSeconds;
|
||||
|
||||
const userID = address && Plebbit.getShortAddress({ address }); // shortened to 8 chars for display; users can verify the full user ID via "Copy user ID" in the post menu to guard against spoofing
|
||||
const userID = address && getShortAddress(address); // shortened to 8 chars for display; users can verify the full user ID via "Copy user ID" in the post menu to guard against spoofing
|
||||
const userIDBackgroundColor = hashStringToColor(userID);
|
||||
const userIDTextColor = getTextColorForBackground(userIDBackgroundColor);
|
||||
|
||||
@@ -562,7 +562,7 @@ const PostMedia = ({
|
||||
? boardPath
|
||||
: subplebbitAddress.endsWith('.eth') || subplebbitAddress.endsWith('.sol')
|
||||
? subplebbitAddress
|
||||
: Plebbit.getShortAddress({ address: subplebbitAddress });
|
||||
: getShortAddress(subplebbitAddress);
|
||||
|
||||
return (
|
||||
<div className={styles.file}>
|
||||
@@ -741,7 +741,7 @@ const PostDesktop = ({
|
||||
? boardPath
|
||||
: subplebbitAddress.endsWith('.eth') || subplebbitAddress.endsWith('.sol')
|
||||
? subplebbitAddress
|
||||
: Plebbit.getShortAddress({ address: subplebbitAddress })
|
||||
: getShortAddress(subplebbitAddress)
|
||||
: undefined;
|
||||
|
||||
const { hidden, unhide, hide } = useHide({ cid });
|
||||
|
||||
Reference in New Issue
Block a user