refactor: memoize shared components for performance optimization

yoginth.com / hey

fork atom

Hey is a decentralized and permissionless social media app built with Lens Protocol 🌿

fork atom

yoginth.com 7 months ago 4c49b988 1e74f7c5

verified

+11 -6

6 changed files

expand all

apps

web

src

components

Shared

Shimmer

AccountListShimmer.tsx

FollowersYouKnowShimmer.tsx

PostShimmer.tsx

SingleAccountShimmer.tsx

SingleGroupShimmer.tsx

SmallSingleAccountShimmer.tsx

+2 -1

apps/web/src/components/Shared/Shimmer/AccountListShimmer.tsx

··· 1 + import { memo } from "react"; 1 2 import SingleAccountShimmer from "./SingleAccountShimmer"; 2 3 3 4 const AccountListShimmer = () => { ··· 14 15 ); 15 16 }; 16 17 17 - export default AccountListShimmer; 18 + export default memo(AccountListShimmer);

+1 -1

apps/web/src/components/Shared/Shimmer/FollowersYouKnowShimmer.tsx

··· 1 - import Skeleton from "@/components/Shared/Skeleton"; 2 1 import { memo } from "react"; 2 + import Skeleton from "@/components/Shared/Skeleton"; 3 3 4 4 const FollowersYouKnowShimmer = () => { 5 5 return (

+2 -1

apps/web/src/components/Shared/Shimmer/PostShimmer.tsx

··· 1 + import { memo } from "react"; 1 2 import Skeleton from "@/components/Shared/Skeleton"; 2 3 3 4 const PostShimmer = () => { ··· 32 33 ); 33 34 }; 34 35 35 - export default PostShimmer; 36 + export default memo(PostShimmer);

+2 -1

apps/web/src/components/Shared/Shimmer/SingleAccountShimmer.tsx

··· 1 + import { memo } from "react"; 1 2 import Skeleton from "@/components/Shared/Skeleton"; 2 3 import cn from "@/helpers/cn"; 3 4 ··· 31 32 ); 32 33 }; 33 34 34 - export default SingleAccountShimmer; 35 + export default memo(SingleAccountShimmer);

+2 -1

apps/web/src/components/Shared/Shimmer/SingleGroupShimmer.tsx

··· 1 + import { memo } from "react"; 1 2 import Skeleton from "@/components/Shared/Skeleton"; 2 3 import cn from "@/helpers/cn"; 3 4 ··· 29 30 ); 30 31 }; 31 32 32 - export default SingleGroupShimmer; 33 + export default memo(SingleGroupShimmer);

+2 -1

apps/web/src/components/Shared/Shimmer/SmallSingleAccountShimmer.tsx

··· 1 + import { memo } from "react"; 1 2 import Skeleton from "@/components/Shared/Skeleton"; 2 3 import cn from "@/helpers/cn"; 3 4 ··· 21 22 ); 22 23 }; 23 24 24 - export default SmallSingleAccountShimmer; 25 + export default memo(SmallSingleAccountShimmer);