mirror of
https://github.com/truewhile/MeBox.git
synced 2026-10-06 05:16:38 +08:00
优化
This commit is contained in:
@@ -151,7 +151,13 @@ export function HomePage() {
|
|||||||
.filter((l) => l.carousel_enabled === true)
|
.filter((l) => l.carousel_enabled === true)
|
||||||
.map((l) => l.id)
|
.map((l) => l.id)
|
||||||
const topRowLibIds = sortedLibraries.slice(0, 3).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)
|
void fetchPreviews(initialTargets, 10)
|
||||||
}, [sortedLibraries, fetchPreviews])
|
}, [sortedLibraries, fetchPreviews])
|
||||||
|
|
||||||
|
|||||||
@@ -482,7 +482,11 @@ function HomeLibraryCard({
|
|||||||
artwork.map(({ src, version }, index) => (
|
artwork.map(({ src, version }, index) => (
|
||||||
<img
|
<img
|
||||||
key={`${src}-${index}`}
|
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=""
|
alt=""
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
referrerPolicy="no-referrer"
|
referrerPolicy="no-referrer"
|
||||||
|
|||||||
@@ -192,6 +192,14 @@ export function LibrariesContent({
|
|||||||
return previews.slice(start, start + ENTRY_PAGE_SIZE)
|
return previews.slice(start, start + ENTRY_PAGE_SIZE)
|
||||||
}, [previews, effectiveEntryPage])
|
}, [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 (
|
return (
|
||||||
<>
|
<>
|
||||||
@@ -342,7 +350,11 @@ function LibraryEntryCard({
|
|||||||
artwork.map(({ src, version }, index) => (
|
artwork.map(({ src, version }, index) => (
|
||||||
<img
|
<img
|
||||||
key={`${src}-${index}`}
|
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=""
|
alt=""
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
referrerPolicy="no-referrer"
|
referrerPolicy="no-referrer"
|
||||||
|
|||||||
Reference in New Issue
Block a user