Discourse의 새로운 클라이언트 사이드 이미지 최적화

뉴스 및 이벤트 공지사항
1

거의 5년 전, 우리는 클라이언트 측 이미지 최적화를 도입하여 사용자가 사이트 제한 크기보다 큰 이미지를 업로드할 수 있도록 하고, 사용자 업로드 대역폭과 커뮤니티 저장 공간을 절약하며, Discourse에서 이미지를 사용하는 전반적인 사용자 경험을 더 부드럽게 만들었습니다.

이러한 기반 위에서, 이 시스템에 몇 가지 새로운 기능을 추가하는 예정된 변경 사항이 있습니다:

GIF → 애니메이션 WEBP 변환

큰 GIF 파일 변환은 이미 오래 전부터 우리의 레이더에 올라와 있었으며, 이제它们是 애니메이션 WebP로 변환됩니다. 이는 원래 파일 크기의 절반에 해당하는 평균 크기를 차지합니다:

1ueX9IP
(2.5MB GIF → 1MB WEBP)

output
(10.1MB GIF → 4.8MB WEBP, 크기로 인해 Discourse 기본 설정에서는 허용되지 않음)

HEIC 변환

2020년에 서버 측 변환을 통해 HEIC 지원을 추가했으며, 이제 컴포저(composer)에서 직접 이러한 파일을 처리하여 게시물이 제출되기 전에 사용자가 변환 결과를 확인할 수 있도록 지원합니다. 클라이언트 측 변환이 어떤 이유로든 실패할 경우를 대비하여 서버 측 변환도 폴백으로 유지했습니다.

20220423_085935
20220423_0859351920×2560 421 KB

(3.4MB HEIC → 650KB JPG)

JXL 변환

JXL 파일에 대한 브라우저 지원이 아직 준비되지 않았지만, 사용자는 이제 JXL 파일을 Discourse에 업로드할 수 있으며, 모든 사용자가 이미지를 볼 수 있도록 자동으로 JPG로 변환됩니다.

chestnut_water
chestnut_water1920×1280 910 KB

(1.1MB JXL → 930KB JPG)

41개의 좋아요
2

효율성을 위한 최적화를 볼 수 있어서 좋습니다! 그런데 왜 JXL과 HEIC 변환, 특히 PNG 변환/압축에 WebP를 더 많이 사용하지 않을까요? AVIF를 제안하고 싶지만, WebP와 달리 아직 널리 지원되지 않는 것 같습니다.

1개의 좋아요
3

투명성을 가진 HEIC와 JXL 이미지는 이미 JPG 대신 WebP로 변환되고 있으며, 항상 WebP를 사용하도록 하는 것도 고려해 보았습니다. 하지만 그렇게 하려면 관리자가 동작을 세밀하게 조정할 수 있도록 수많은 사이트 설정을 추가해야 했기 때문에 주저하게 되었습니다.

저도 같은 의견입니다.

이상적으로는 클라이언트와 서버 양쪽에서 이미지 압축을 제어할 수 있는 설정을 통해 관리자의 권한을 강화하되, 여전히 합리적인 기본값을 제공하며, Telegram이나 WhatsApp처럼 최종 사용자가 업로드 시 컴포저 모달 옵션을 통해 실시간으로 압축을 해제할 수 있도록 하는 것이 좋겠습니다. 하지만 내부에서는 해당 작업에 대한 의지가 없습니다.

7개의 좋아요
4

이거에 대해 소식 있나요? :smiley: 최소한 베타 버전에서라도 보고 싶네요…