优化 | Next.js - 简体中文

Next.js 提供了多种内置优化功能，旨在提升应用速度和核心 Web 指标。本指南将介绍可用来增强用户体验的优化方案。

内置组件

内置组件封装了常见 UI 优化的实现复杂度。这些组件包括：

元数据能帮助搜索引擎更好地理解您的内容（从而提升 SEO 效果），并允许您自定义内容在社交媒体上的展示方式，帮助您在不同平台上创建更具吸引力和一致性的用户体验。

Next.js 中的元数据 API 允许您修改页面的 <head> 元素。您可以通过两种方式配置元数据：

基于配置的元数据：在 layout.js 或 page.js 文件中导出静态 metadata 对象或动态 generateMetadata 函数。
基于文件的元数据：向路由段添加静态或动态生成的特殊文件。

此外，您还可以使用 imageResponse 构造函数，通过 JSX 和 CSS 创建动态 Open Graph 图片。

Next.js 的 /public 文件夹可用于提供静态资源，如图片、字体和其他文件。/public 内的文件还可以被 CDN 提供商缓存，从而实现高效分发。

对于大型应用，Next.js 集成了流行的分析和监控工具，帮助您了解应用性能。更多信息请参阅 OpenTelemetry 以及 Instrumentation 指南。