next/font

폰트 설정은 소스, 범위, 표시 방식, 적용 위치를 한 번에 결정한다

`next/font`는 폰트를 단순히 불러오는 API가 아니라, 빌드 산출물과 브라우저 표시 전략을 동시에 정하는 계약이다.

설정할 값

소스
next/font/google 또는 next/font/local
범위
subsets, weight, style로 받을 글꼴만 남김
표시
display, preload로 빈 글자와 늦은 교체를 제어
적용
className 또는 variable을 레이아웃에 연결

빌드 후 달라지는 것

파일 필요한 폰트만 정적 자산으로 포함되어 원격 요청 의존이 줄어든다.
CSS 자동 생성된 `@font-face`와 fallback 메트릭이 레이아웃 흔들림을 줄인다.
HTML 중요 폰트는 preload되어 첫 화면 텍스트가 더 빨리 안정된다.