Same font loaded in several modules
Why it matters
Every next/font call is hosted as its own instance: the same family loaded in two modules is downloaded twice.
Fix
Load each font once in a shared module (e.g. app/fonts.ts) and import the font object where you need it.
Credit
From the Next.js team
Each next/font call creates its own hosted font instance, so the docs advise creating a font once and importing it where needed.
References
- Font ModuleNext.js
- Font OptimizationNext.js