Мақала ағылшын тілінде қолжетімді.
· 1 мин оқу
Next.js App Router performance basics we ship by default
Image formats, font loading, and caching choices that keep Lighthouse green without a rewrite.
Performance work is cheaper when it is boring and early. On Appfield landing and product builds we treat a few Next.js defaults as non-negotiable.
Prefer modern image delivery
Serve AVIF/WebP, size assets to the layout they fill, and avoid decorative hero overlays that force heavy composites. A full-bleed photo still wins when it is compressed and prioritized correctly.
Fonts with display: swap
Display fonts should never block text forever. We load one expressive family for headlines and a clean sans for body — then stop. Extra weights are a silent Lighthouse tax.
Cache what does not change
Static marketing routes, blog MDX, and case studies should be prerendered. Dynamic only where user input or personalization requires it.
Measure the real first viewport
Home and contact pages carry the conversion story. Keep the first screen to brand, one headline, one supporting line, and a CTA group — then ship motion that clarifies hierarchy instead of adding noise.
These habits routinely keep Performance scores in the 90s without heroic tooling.