alphard/ComfyUI-Lora-Manager
1
0
Fork 0
mirror of https://github.com/willmiao/ComfyUI-Lora-Manager.git synced 2026-09-21 03:01:27 -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
tests/frontend/utils/civitaiUtils.test.js
+34
View File
@@ -8,6 +8,7 @@ import {
rewriteCivitaiUrl,
getOptimizedUrl,
getShowcaseUrl,
getDisplayUrl,
getThumbnailUrl,
getGalleryThumbnailUrl,
extractCivitaiImageId,
@@ -22,6 +23,7 @@ describe('civitaiUtils', () => {
describe('OptimizationMode', () => {
it('should have correct mode values', () => {
expect(OptimizationMode.SHOWCASE).toBe('showcase');
expect(OptimizationMode.DISPLAY).toBe('display');
expect(OptimizationMode.THUMBNAIL).toBe('thumbnail');
expect(OptimizationMode.GALLERY_THUMBNAIL).toBe('gallery-thumbnail');
});
@@ -125,6 +127,22 @@ describe('civitaiUtils', () => {
expect(rewritten).toBe('https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/transcode=true,width=160,optimized=true/12345.mp4');
});
it('should rewrite image URLs with /original=true for display mode (width=2400)', () => {
const originalUrl = 'https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/original=true/12345.jpeg';
const [rewritten, wasRewritten] = rewriteCivitaiUrl(originalUrl, 'image', OptimizationMode.DISPLAY);
expect(wasRewritten).toBe(true);
expect(rewritten).toBe('https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/width=2400,optimized=true/12345.jpeg');
});
it('should keep videos full quality in display mode (no transcode/width)', () => {
const originalUrl = 'https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/original=true/12345.mp4';
const [rewritten, wasRewritten] = rewriteCivitaiUrl(originalUrl, 'video', OptimizationMode.DISPLAY);
expect(wasRewritten).toBe(true);
expect(rewritten).toBe('https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/optimized=true/12345.mp4');
});
it('should not rewrite URLs without /original=true', () => {
const originalUrl = 'https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/width=450/12345.jpeg';
const [rewritten, wasRewritten] = rewriteCivitaiUrl(originalUrl, 'image', OptimizationMode.THUMBNAIL);
@@ -250,6 +268,22 @@ describe('civitaiUtils', () => {
});
});
describe('getDisplayUrl', () => {
it('should return display-optimized URL (width=2400) for images', () => {
const originalUrl = 'https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/original=true/12345.jpeg';
const displayUrl = getDisplayUrl(originalUrl, 'image');
expect(displayUrl).toBe('https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/width=2400,optimized=true/12345.jpeg');
});
it('should keep videos full quality', () => {
const originalUrl = 'https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/original=true/12345.mp4';
const displayUrl = getDisplayUrl(originalUrl, 'video');
expect(displayUrl).toBe('https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/optimized=true/12345.mp4');
});
});
describe('getGalleryThumbnailUrl', () => {
it('should return gallery-thumbnail-optimized URL (width=160)', () => {
const originalUrl = 'https://image.civitai.com/xG1nkqKTMzGDvpLrqFT7WA/abc123/original=true/12345.jpeg';