Next.js next/font

内置字体优化，防止 CLS 布局偏移。

tsx

import { Geist } from 'next/font/google'

const geist = Geist({ subsets: ['latin'] })

export default function Layout({ children }) {
  return <body className={geist.className}>{children}</body>
}

自动子集化（只加载需要的字符）
构建时下载字体到本地，零网络请求

Next.js next/font ​

Next.js next/font