11FAQ
SVGA 형식 사양, 크로스 플랫폼 플레이어, Web Lite에 관한 자주 묻는 질문.
기본
SVGA의 위치, 적용 시나리오, 오픈 소스 생태계를 이해합니다.
SVGA란 무엇인가요?
SVGA는 크로스 플랫폼 오픈 소스 애니메이션 형식으로 iOS, Android, Flutter, Web, HarmonyOS 등 여러 플랫폼을 지원하며 고성능 애니메이션 재생 경험을 제공합니다. 자세한 내용은 SVGA 공식 문서 저장소를 참고하세요.
SVGA는 어떤 애니메이션 시나리오에 적합한가요?
SVGA는 라이브 방송 선물, 이벤트 장식, 제품 가이드, 인터랙티브 피드백처럼 높은 재현도와 크로스 플랫폼 재생이 필요한 애니메이션에 적합합니다.
SVGA와 GIF 또는 프레임 애니메이션의 차이는 무엇인가요?
SVGA는 타임라인과 리소스 구조를 유지하며 Dragonbones / CreateJS와 유사합니다. 일반적으로 프레임별 이미지보다 크기를 줄이기 쉽고 재생 제어와 크로스 플랫폼 재사용에도 적합합니다.
SVGA는 오픈 소스 프로젝트인가요?
네. SVGA의 플레이어, 변환기, 형식 사양은 커뮤니티에서 유지 관리하며 GitHub svga 조직에서 소스 코드를 확인하고 이슈를 제출하거나 기여할 수 있습니다.
형식 사양
SVGA 파일 구조와 1.x / 2.x 버전 차이.
SVGA에는 어떤 형식 버전이 있나요?
SVGA에는 1.x와 2.x 두 가지 버전이 있습니다. 1.x는 JSON으로 애니메이션을 기술하고 2.x는 ProtoBuf로 기술합니다. 복잡한 애니메이션에서 JSON 파일이 지나치게 커지고 파싱 시간과 메모리 사용량이 늘어나 JSON 방식은 2.0부터 폐기되었습니다.
1.x와 2.x 형식의 차이는 무엇인가요?
1.x는 JSON 텍스트로 기술하고(1.x 형식 사양), 2.x는 ProtoBuf 바이너리로 기술하며 zlib로 압축합니다(2.x Proto 프로토콜). 파일 크기가 더 작고 파싱이 더 빠릅니다.
SVGA 파일의 확장자와 구조는 어떻게 되나요?
SVGA 파일은 확장자가
.svga이며 ZIP으로 압축되어 있습니다. 압축을 풀면 하위 디렉터리가 없어야 하고 파일 이름에 중국어, 일본어 등 비표준 문자를 포함할 수 없습니다. 비트맵은 PNG-8 또는 PNG-24 형식이어야 하며 pngquant로 압축하는 것을 권장합니다.플레이어의 형식 버전 호환성은 어떻게 되나요?
2.0.0 Player는 2.x 형식을 재생할 수 있고 1.x 형식과도 하위 호환됩니다. 1.x Player는 1.x 형식만 재생할 수 있으며 2.x는 재생할 수 없습니다.
SVGA 형식의 Roadmap은 무엇인가요?
2.0.0은 Audio(오디오)와 Bitmap Mask(비트맵 마스크) 기능을 지원할 예정입니다. 1.x는 안정성만 보장합니다. 자세한 내용은 SVGA-Format 저장소를 참고하세요.
플레이어와 통합
플랫폼별 플레이어 선택, 변환기, 커뮤니티 리소스.
SVGA는 어떤 플랫폼을 지원하나요?
iOS, Android, Flutter, Web, Web Lite, WeChat 미니 프로그램, HarmonyOS NEXT 등의 플레이어를 공식으로 제공합니다. 전체 목록은 svga/docs를 참고하세요.
Web 버전과 Web Lite 버전 플레이어의 차이는 무엇인가요?
SVGAPlayer for Web은 전체 기능 플레이어입니다. SVGAPlayer-Web-Lite는 모바일 Web을 대상으로 하며 더 작고(<60kb, gzip<18kb) 성능이 높지만 SVGA 1.x 형식과 오디오 재생은 지원하지 않습니다.
디자이너는 SVGA 파일을 어떻게 내보내나요?
디자이너는 SVGAConverter를 사용해 After Effects 또는 Animate에서 .svga 파일을 내보낼 수 있습니다.
커뮤니티의 서드파티 리소스에는 무엇이 있나요?
Web Lite 전용
SVGAPlayer-Web-Lite의 특징, 제한, 사용 방법.
SVGAPlayer-Web-Lite란 무엇인가요?
SVGA의 모바일 Web용 경량 플레이어로 더 가볍고 효율적인 것을 목표로 합니다. 크기는 <60kb(gzip <18kb)이며 Android 4.4+ / iOS 9+와 호환됩니다. 자세한 내용은 저장소를 참고하세요.
Web Lite는 성능 향상을 위해 어떤 기술을 사용하나요?
멀티 스레드(WebWorker)로 파일 데이터를 파싱하고 OffscreenCanvas / ImageBitmap으로 렌더링하여 더 나은 비동기 처리를 제공합니다. 실험적 기능으로 WebWorker에서 렌더링 엔진 실행, WebAssembly로 WebWorker 대체, GPU 가속 연산 등이 있습니다.
Web Lite에는 어떤 제한이 있나요?
SVGA 1.x 형식 재생과 오디오 재생을 지원하지 않습니다. 1.x 호환성이나 오디오가 필요하면 전체 기능 버전인 SVGAPlayer for Web을 사용하세요.
SVGAPlayer-Web-Lite는 어떻게 설치하나요?
npm으로 설치할 수 있습니다:
yarn add svga 또는 npm i svga. CDN으로 불러올 수도 있습니다: <script src="https://unpkg.com/svga/dist/index.min.js">.Web Lite는 어떤 고급 기능을 지원하나요?
요소 교체와 동적 요소 삽입(파싱된 데이터 수정으로 구현), IndexedDB를 이용한 파싱 데이터 영구 캐시로 중복 다운로드와 파싱 방지, 뷰포트 감지(IntersectionObserver)로 화면 밖 렌더링 중지, 재생된 프레임 캐시로 반복 재생 성능 향상 등을 지원합니다.