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> </span>
)} )}
{/* Virtuoso infinite scroll for post page view with all replies */} {/* Virtuoso infinite scroll for post page view with more than 25 replies */}
{!isHidden && showAllReplies && !isInPendingPostView && showReplies && filteredReplies.length > 0 && ( {!isHidden && showAllReplies && !isInPendingPostView && showReplies && replyCount > 25 && (
<Virtuoso <Virtuoso
increaseViewportBy={{ bottom: 1200, top: 1200 }} increaseViewportBy={{ bottom: 1200, top: 1200 }}
totalCount={filteredReplies.length} totalCount={filteredReplies.length}
@@ -517,6 +517,17 @@ const PostDesktop = ({ post, roles, showAllReplies, showReplies = true }: PostPr
initialScrollTop={lastVirtuosoState?.scrollTop} 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) */} {/* Non-virtualized rendering for board view (last 5 replies or show omitted) */}
{!isHidden && {!isHidden &&
!showAllReplies && !showAllReplies &&
+13 -2
View File
@@ -374,8 +374,8 @@ const PostMobile = ({ post, roles, showAllReplies, showReplies = true }: PostPro
</div> </div>
)} )}
</div> </div>
{/* Virtuoso infinite scroll for post page view with all replies */} {/* Virtuoso infinite scroll for post page view with more than 25 replies */}
{!(pinned && !isInPostView) && showAllReplies && !isInPendingPostView && showReplies && filteredReplies.length > 0 && ( {!(pinned && !isInPostView) && showAllReplies && !isInPendingPostView && showReplies && replyCount > 25 && (
<Virtuoso <Virtuoso
increaseViewportBy={{ bottom: 1200, top: 1200 }} increaseViewportBy={{ bottom: 1200, top: 1200 }}
totalCount={filteredReplies.length} totalCount={filteredReplies.length}
@@ -393,6 +393,17 @@ const PostMobile = ({ post, roles, showAllReplies, showReplies = true }: PostPro
initialScrollTop={lastVirtuosoState?.scrollTop} 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) */} {/* Non-virtualized rendering for board view (last 5 replies) */}
{!(pinned && !isInPostView) && {!(pinned && !isInPostView) &&
!showAllReplies && !showAllReplies &&