폰트 경량화를 통한 빌드 파일 경량화

현대 웹 개발에서 성능 최적화는 사용자 경험을 좌우하는 핵심 요소이다. 특히 폰트 파일은 웹 애플리케이션에서 상당한 용량을 차지하는 경우가 많아, 이들의 경량화는 빌드 파일 크기를 줄이는 데 큰 기여를 할 수 있다. 폰트를 경량화하는 방법으로는 사용하지 않는 글리프(glyph)를 제거하거나 필요한 문자 집합만을 포함하는 방법이 있으며, 이를 통해 프로젝트의 전체 파일 크기를 상당히 줄일 수 있다.

폰트 경량화의 필요성

폰트는 시각적 완성도를 높이는 데 중요한 역할을 하지만, 크기가 커지면 로딩 속도에 부정적 영향을 미친다. 특히 웹사이트나 애플리케이션이 여러 폰트를 사용하거나 다양한 스타일을 포함할 경우, 로딩에 소모되는 시간과 자원이 크게 늘어난다. 따라서 폰트를 경량화하면 불필요한 리소스를 줄이고, 최적화된 빌드 파일로 사용자에게 빠른 경험을 제공할 수 있다.

폰트 경량화 작업의 주요 과정

1. 문자 세트 확인: 프로젝트에서 실제로 필요한 문자 세트를 확인하는 것이 첫 단계이다. 예를 들어, 웹 애플리케이션에서 영문과 숫자만 필요하다면 그 외의 글리프를 제외할 수 있다.

2. 글리프 서브셋 만들기: glyphhanger와 같은 도구를 사용하여 폰트 파일에서 필요한 글리프만 남기는 서브셋 작업을 할 수 있다. 예를 들어, glyphhanger --subset 명령을 통해 특정 언어나 특수 문자만 포함하는 폰트를 생성할 수 있다. 이렇게 서브셋된 폰트는 불필요한 글리프가 제거되어 훨씬 작은 파일로 만들어진다.

3. 최적화된 폰트 적용: 서브셋 폰트를 생성한 후에는 프로젝트에 이를 적용하여 최적화된 폰트로 빌드를 진행한다. 결과적으로 빌드 파일 크기를 줄여 사용자의 로딩 시간을 단축할 수 있다.

예제: glyphhanger를 활용한 경량화

glyphhanger는 필요 없는 글리프를 제외하고, 필수적인 글리프만 포함하는 서브셋 폰트를 만드는 도구이다. 다음 명령어로 숫자와 일부 특수 문자만 포함한 폰트를 생성할 수 있다.

glyphhanger --subset=./Pretendard-Light.ttf --formats=ttf --US_ASCII --latin --whitelist='0123456789.,%#:+-=()@!' --output=./

위 명령은 Pretendard-Light.ttf 폰트를 경량화하여 숫자와 몇 가지 특수 문자만 남긴 새로운 파일을 생성한다. 결과적으로 훨씬 작은 폰트 파일이 만들어지며, 최종 빌드 파일의 크기도 함께 감소한다.

결론

폰트 경량화는 빌드 파일 최적화의 핵심이다. 사용하지 않는 글리프를 제거하는 방식으로, 불필요한 데이터 로딩을 줄여 사용자 경험을 개선할 수 있다. 개발자는 필요한 글리프만 포함한 서브셋 폰트를 활용하여 더 가볍고 빠른 웹 애플리케이션을 만들 수 있다.