From 670dd90dbef8668ae1b58f5ebe69cff626b0c4a1 Mon Sep 17 00:00:00 2001
From: truewhile <62226914+truewhile@users.noreply.github.com>
Date: Sun, 13 Sep 2026 21:03:06 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/pages/HomePage.tsx              |  8 +++++++-
 web/src/pages/HomePageSections.tsx      |  6 +++++-
 web/src/pages/LibrariesPageSections.tsx | 14 +++++++++++++-
 3 files changed, 25 insertions(+), 3 deletions(-)

diff --git a/web/src/pages/HomePage.tsx b/web/src/pages/HomePage.tsx
index 6840e42..f8f6561 100644
--- a/web/src/pages/HomePage.tsx
+++ b/web/src/pages/HomePage.tsx
@@ -151,7 +151,13 @@ export function HomePage() {
       .filter((l) => l.carousel_enabled === true)
       .map((l) => l.id)
     const topRowLibIds = sortedLibraries.slice(0, 3).map((l) => l.id)
-    const initialTargets = Array.from(new Set([...carouselLibIds, ...topRowLibIds]))
+    // 入口网格仍然是一次展示 20 个库；没有自定义封面的库必须在首屏
+    // 立即拉预览，否则会先出现占位图标再补图，体感反而更慢。
+    const topGridLibIds = sortedLibraries
+      .slice(0, 20)
+      .filter((l) => !l.cover_url)
+      .map((l) => l.id)
+    const initialTargets = Array.from(new Set([...carouselLibIds, ...topRowLibIds, ...topGridLibIds]))
     void fetchPreviews(initialTargets, 10)
   }, [sortedLibraries, fetchPreviews])
 
diff --git a/web/src/pages/HomePageSections.tsx b/web/src/pages/HomePageSections.tsx
index d91ceaa..df51cdb 100644
--- a/web/src/pages/HomePageSections.tsx
+++ b/web/src/pages/HomePageSections.tsx
@@ -482,7 +482,11 @@ function HomeLibraryCard({
           artwork.map(({ src, version }, index) => (
             <img
               key={`${src}-${index}`}
-              src={imageURL(src, version, { maxWidth: 480, maxHeight: 320, quality: 78 })}
+              src={imageURL(
+                src,
+                version,
+                library.cover_url ? undefined : { maxWidth: 480, maxHeight: 320, quality: 78 },
+              )}
               alt=""
               loading="lazy"
               referrerPolicy="no-referrer"
diff --git a/web/src/pages/LibrariesPageSections.tsx b/web/src/pages/LibrariesPageSections.tsx
index 2487c5b..5fa3cbd 100644
--- a/web/src/pages/LibrariesPageSections.tsx
+++ b/web/src/pages/LibrariesPageSections.tsx
@@ -192,6 +192,14 @@ export function LibrariesContent({
     return previews.slice(start, start + ENTRY_PAGE_SIZE)
   }, [previews, effectiveEntryPage])
 
+  // 入口网格首屏展示前 20 个库；没有自定义封面的库需要立即拉预览，否则卡片会先渲染占位图标再补图。
+  useEffect(() => {
+    const ids = pagedPreviews.filter((preview) => !preview.library.cover_url).map((preview) => preview.library.id)
+    if (ids.length > 0) {
+      onNeedPreviews?.(ids)
+    }
+  }, [pagedPreviews, onNeedPreviews])
+
 
   return (
     <>
@@ -342,7 +350,11 @@ function LibraryEntryCard({
           artwork.map(({ src, version }, index) => (
             <img
               key={`${src}-${index}`}
-              src={imageURL(src, version, { maxWidth: 400, maxHeight: 300, quality: 78 })}
+              src={imageURL(
+                src,
+                version,
+                library.cover_url ? undefined : { maxWidth: 400, maxHeight: 300, quality: 78 },
+              )}
               alt=""
               loading="lazy"
               referrerPolicy="no-referrer"