SVG 파일은 편집기 메타데이터, 과도한 소수점, 복잡한 경로 때문에 무거워지는 경우가 많습니다. 이 체크리스트는 시각적 품질을 깨지 않으면서 크기를 줄이는 데 도움을 줍니다.
1) 구조적 비대화 제거
- 메타데이터, 주석, 편집기 전용 네임스페이스를 제거합니다.
- 중복 그룹을 평평하게 만들고 사용하지 않는 defs, 마스크, 클립을 삭제합니다.
- 프로덕션에서 렌더링되지 않는 숨겨진 레이어를 삭제합니다.
2) 크기에 맞게 지오메트리 조정
- UI 스케일에 맞는 안전한 소수점 임계값으로 경로 정밀도를 낮춥니다.
- 호환되는 경로를 병합하고 가능하면 복잡한 곡선을 단순화합니다.
- 반복되는 아이콘은 심볼/스프라이트를 사용해 중복 페이로드를 피합니다.
3) 실제 환경에서 검증
- 대상 배경색과 DPR 범위에서 아이콘을 테스트합니다.
- 주요 화면에서 전후를 비교해 미묘한 시각적 회귀를 잡아냅니다.
- 절감한 바이트를 기록하고 CI에서 한도를 적용합니다.