next/font는 소스부터 적용 위치까지 한 계약으로 묶는다

필요한 글꼴만 빌드 자산에 포함하고 첫 화면의 표시 방식과 CSS 연결을 함께 결정한다.

1

Source

Google 또는 local 파일의 권위 원본 선택

2

Subset · weight

실제로 쓸 문자 범위와 굵기만 포함

3

Display · preload

빈 글자와 늦은 교체, 첫 화면 우선순위 결정

4

className · variable

root layout에 한 번 연결해 하위 UI에 적용

핵심폰트 범위를 좁히고 fallback 메트릭을 맞추면 전송량과 layout shift를 함께 줄일 수 있다.