perf: only virtualize replies when count exceeds first page size

This commit is contained in:
plebeius
2025-12-27 18:25:35 +01:00
parent 882b7b4a99
commit 2b8d6f4fce
2 changed files with 26 additions and 4 deletions
+13 -2
View File
@@ -498,8 +498,8 @@ const PostDesktop = ({ post, roles, showAllReplies, showReplies = true }: PostPr
)}
</span>
)}
{/* Virtuoso infinite scroll for post page view with all replies */}
{!isHidden && showAllReplies && !isInPendingPostView && showReplies && filteredReplies.length > 0 && (
{/* Virtuoso infinite scroll for post page view with more than 25 replies */}
{!isHidden && showAllReplies && !isInPendingPostView && showReplies && replyCount > 25 && (
<Virtuoso
increaseViewportBy={{ bottom: 1200, top: 1200 }}
totalCount={filteredReplies.length}
@@ -517,6 +517,17 @@ const PostDesktop = ({ post, roles, showAllReplies, showReplies = true }: PostPr
initialScrollTop={lastVirtuosoState?.scrollTop}
/>
)}
{/* Non-virtualized rendering for post page view with 25 or fewer replies */}
{!isHidden &&
showAllReplies &&
!isInPendingPostView &&
showReplies &&
replyCount <= 25 &&
filteredReplies.map((reply, index) => (
<div key={index} className={styles.replyContainer}>
<Reply reply={reply} roles={roles} postReplyCount={replyCount} />
</div>
))}
{/* Non-virtualized rendering for board view (last 5 replies or show omitted) */}
{!isHidden &&
!showAllReplies &&
+13 -2
View File
@@ -374,8 +374,8 @@ const PostMobile = ({ post, roles, showAllReplies, showReplies = true }: PostPro
</div>
)}
</div>
{/* Virtuoso infinite scroll for post page view with all replies */}
{!(pinned && !isInPostView) && showAllReplies && !isInPendingPostView && showReplies && filteredReplies.length > 0 && (
{/* Virtuoso infinite scroll for post page view with more than 25 replies */}
{!(pinned && !isInPostView) && showAllReplies && !isInPendingPostView && showReplies && replyCount > 25 && (
<Virtuoso
increaseViewportBy={{ bottom: 1200, top: 1200 }}
totalCount={filteredReplies.length}
@@ -393,6 +393,17 @@ const PostMobile = ({ post, roles, showAllReplies, showReplies = true }: PostPro
initialScrollTop={lastVirtuosoState?.scrollTop}
/>
)}
{/* Non-virtualized rendering for post page view with 25 or fewer replies */}
{!(pinned && !isInPostView) &&
showAllReplies &&
!isInPendingPostView &&
showReplies &&
replyCount <= 25 &&
filteredReplies.map((reply, index) => (
<div key={index} className={styles.replyContainer}>
<Reply postReplyCount={replyCount} reply={reply} roles={roles} />
</div>
))}
{/* Non-virtualized rendering for board view (last 5 replies) */}
{!(pinned && !isInPostView) &&
!showAllReplies &&