
App Router: Optimizing Fonts and Images글꼴을 최적화 해야하는 이유프로젝트에서 사용자 지정 글꼴을 사용하면 글꼴파일 로드시 성능에 영향을 미칠 수 있다.ex) 시스템 글꼴로 랜더링 후 사용자 글꼴로 텍스트가 렌더링 됨에 따라 텍스트 크기, 간격 등이 변경되어 주변 요소에 영향을 미친다.NextJs는 빌드시 글꼴 파일을 다운로드해 다른 정적 자산과 함께 호스팅한다.즉 next/font/폰트명 으로 폰트를 다운받고, 정적 자산으로 번들링 된다.따라서 사용자가 애플리케이션에 방문 시 성능에 영향을 줄 수 있는 네트워크 요청이 없다.기본 글꼴 추가/app/ui 폴더에 fonts.ts 를 만듭니다.import { Inter } from 'next/font/google'; export..