alphard/ComfyUI-Lora-Manager
1
0
Fork 0
mirror of https://github.com/willmiao/ComfyUI-Lora-Manager.git synced 2026-09-21 11:11:26 -03:00
Code Issues Packages Projects Releases Wiki Activity

perf(showcase): cap main viewer image width at 2400 via display mode

Browse Source 
- New OptimizationMode.DISPLAY (width=2400 for images, full quality for
  videos) and getDisplayUrl(); the in-modal main viewer renders at most
  ~1200 CSS px wide, so full-size originals wasted 50-70% bandwidth
- Main viewer and adjacent prefetch use display URLs; the full-size
  media viewer keeps using getShowcaseUrl for original quality
This commit is contained in:
Will Miao
2026-09-01 22:45:00 +08:00
parent 3005d2877e
commit f7b247f9e8
3 changed files with 63 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/js/components/shared/showcase/ShowcaseView.js
+7 -4
View File
@@ -22,7 +22,7 @@ import {
} from './MediaUtils.js';
import { generateMetadataPanel } from './MetadataPanel.js';
import { generateImageWrapper, generateVideoWrapper } from './MediaRenderers.js';
import { getShowcaseUrl, getGalleryThumbnailUrl } from '../../../utils/civitaiUtils.js';
import { getShowcaseUrl, getDisplayUrl, getGalleryThumbnailUrl } from '../../../utils/civitaiUtils.js';
import { openMediaViewer } from '../MediaViewer.js';
import { escapeAttribute } from '../utils.js';
@@ -311,8 +311,9 @@ function renderMediaItem(img, index, exampleFiles) {
originalRemoteUrl.endsWith('.mp4') || originalRemoteUrl.endsWith('.webm');
const mediaType = isVideo ? 'video' : 'image';
// Optimize CivitAI URLs for showcase display (full quality)
const remoteUrl = getShowcaseUrl(originalRemoteUrl, mediaType);
// Optimize CivitAI URLs for in-modal display (images capped at width=2400;
// the full-size media viewer uses getShowcaseUrl separately)
const remoteUrl = getDisplayUrl(originalRemoteUrl, mediaType);
const localUrl = localFile ? localFile.path : '';
@@ -466,7 +467,9 @@ function prefetchAdjacentMedia() {
const isVideo = img.url.endsWith('.mp4') || img.url.endsWith('.webm');
if (isVideo) return;
const url = getShowcaseUrl(img.url, 'image');
// Must match the main viewer's URL (display mode) or the warmed
// cache entry is never used
const url = getDisplayUrl(img.url, 'image');
if (prefetchedUrls.has(url)) return;
prefetchedUrls.add(url);