네트워크 기반 Compose Preview 문제 해결

이 게시물은 Jetpack Compose에서 네트워크 기반 이미지 컴포넌트 YDSImage의 Preview 렌더링 문제와 그 해결법에 대해 설명합니다.

문제 원인

• Preview 환경에서는 네트워크 요청이 불가능하여 AsyncImage가 이미지를 불러오지 못함
• imageLoadState가 초기 상태에서 벗어나지 않아 Preview에 UI가 나타나지 않음

해결 방법

• LocalInspectionMode.current를 활용해 Preview 모드 감지
• Preview 환경에서는 네트워크 요청을 건너뛰고 기본 이미지를 렌더링하도록 분기 처리

적용 결과

• Preview에서 컴포넌트들이 정상적으로 기본 이미지를 표시해 UI를 잘 표현
• 팀 내 공유 및 상용 프로젝트에 반영되어 개발 효율성 향상