From 2b8d6f4fceea040daa6865fbab77cb2dcaa85671 Mon Sep 17 00:00:00 2001
From: plebeius <tom@plebbit.com>
Date: Sat, 27 Dec 2025 18:25:35 +0100
Subject: [PATCH] perf: only virtualize replies when count exceeds first page
 size

---
 src/components/post-desktop/post-desktop.tsx | 15 +++++++++++++--
 src/components/post-mobile/post-mobile.tsx   | 15 +++++++++++++--
 2 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/src/components/post-desktop/post-desktop.tsx b/src/components/post-desktop/post-desktop.tsx
index 65d3c59d..42b92124 100644
--- a/src/components/post-desktop/post-desktop.tsx
+++ b/src/components/post-desktop/post-desktop.tsx
@@ -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 &&
diff --git a/src/components/post-mobile/post-mobile.tsx b/src/components/post-mobile/post-mobile.tsx
index 20bca1e9..d7c59eee 100644
--- a/src/components/post-mobile/post-mobile.tsx
+++ b/src/components/post-mobile/post-mobile.tsx
@@ -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 &&