들어가기
- 동아리 활동 중 로띠를 활용하면 애니메이션이 즐거울 것 같다는 이야기를 들었다.
- 로띠가 뭔지 바로 검색
- 찾아보니 구글홈을 설정할 때 봤던 애니메이션이 로띠였다.
로띠 (Lottie)는?
- 위키백과에서는
백터 애니메이션을 위한 파일 형식이라고 소개하고 있다. - 로띠에서는 JSON 파일을 사용한다.
- 따라서 파일 내부를 열어 보면 SVG처럼 뭔가 읽을 수 있는 코드를 볼 수 있다.
- 로띠 라이브러리를 사용해서 JSON파일을 애니메이션으로 출력할 수 있다.
장점
- 용량이 작다.
- 공식 홈페이지에서 소개하는 예시에 따르면 gif파일보다 600%더 작다고 한다.
- 위에 삽입한 애니메이션의 경우 Lottie는
56KBGIF 파일은375KB이다.
- 크기가 커져도 깨지지 않는다.
- 백터 기반이기 때문에 크기가 커진다고 해도 자연스럽다.
- 그래서 크기가 큰 이미지의 경우 Lottie가 훨씬 용량이 작을 것이다.
단점
- 컴퓨터 자원을 활용한다.
- 단순하게 이미지를 순서대로 보여주는 것이 아니다. (GIF 애니메이션)
- 따라서 컴퓨터가 애니메이션을 표현하기 위해 계산이 들어가야 한다.
- (하지만, 이미지 여러장을 처리하는 것보다 애니메이션을 계산하여 처리하는게 더 빠를지도…)