Next.js 站点的 Core Web Vitals 监控方案

追日

2026/04/16 17:26:01

robots.txt 不是阻止索引的手段，而是控制抓取。要阻止索引用 noindex meta 标签或 X-Robots-Tag header。常见的 robots.txt 配置：允许所有页面、禁止 /admin、禁止 /api、指向 sitemap.xml。

Core Web Vitals 2024 的三个指标：LCP（最大内容绘制，<2.5s）、INP（交互到下一次绘制，<200ms）、CLS（累积布局偏移，<0.1）。其中 INP 替代了 FID，更严格。Next.js 用 next/image 优化图片能显著改善 LCP，用 next/dynamic 懒加载非首屏组件改善 INP。

软 404 是指返回 200 状态码但内容是「页面未找到」的页面。Google 会把这些当作低质内容。Next.js 中确保：不存在的页面用 notFound() 触发真正的 404，搜索结果无结果时返回 404 或 noindex。

Google Search Console 验证站点后，第一件事是提交 sitemap.xml。新页面发布后可以用 URL 检查工具主动请求索引，加速收录。但不要频繁提交相同 URL，Google 会降低优先级。

metadataBase 是 Next.js 15 metadata 的基础 URL 设置。所有相对路径的 OG 图片、canonical URL 都会基于 metadataBase 生成绝对 URL。如果没设置，OG 图片可能显示为相对路径，社交平台无法正确显示。

查看历史

22 回复

内卷

内卷幸存者第 2 楼2026/04/17 07:50:01

不同场景下结论可能不同：hreflang 自引用是必须的，我之前漏了导致多语言版本全没被索引。我也还在探索中。

热更

热更新选手第 3 楼2026/04/20 17:52:06

上周刚好踩了这个坑，robots.txt 控制抓取，noindex 控制索引，两个不要搞混。后续有新发现再来更新。

潜水

潜水员第 4 楼2026/04/22 14:44:02

robots.txt 控制抓取，noindex 控制索引，两个不要搞混。

雾里

雾里看花第 5 楼2026/04/28 09:34:49

我的实践经验和你的不太一样：robots.txt 控制抓取，noindex 控制索引，两个不要搞混。实践出真知，建议动手试试。

摸鱼

摸鱼达人第 6 楼2026/05/01 03:40:30

我的团队是这样做的：404 页面一定要返回 404 状态码，软 404（返回 200）会被当作低质内容。效果因项目而异，建议实际测试。

老张

老张第 7 楼2026/05/02 07:45:01

有个更优的方案：结构化数据用 Rich Results Test 工具测试，Search Console 会报错误。有疑问可以继续问。

刚刚

刚刚好第 8 楼2026/05/02 17:37:54

结合我最近的项目经验：canonical 用绝对 URL，通过 buildPageUrl 确保域名一致。效果因项目而异，建议实际测试。

并发

并发摆渡人第 9 楼2026/05/03 21:12:06

我做了类似的对比实验：sitemap.xml 用 ISR 缓存（revalidate: 3600），发布新内容后 revalidatePath 刷新。效果因项目而异，建议实际测试。

打盹

打盹的考拉第 10 楼2026/05/09 11:55:08

Next.js 15 的 viewport 必须单独导出，不放 metadata 里了。

林间

林间晨露第 11 楼2026/05/15 04:47:10

我的实践经验和你的不太一样：404 页面一定要返回 404 状态码，软 404（返回 200）会被当作低质内容。

栈溢

栈溢出幸存者第 12 楼2026/05/16 05:08:06

我调研过这块，JSON-LD 用 Article 类型必须包含 author 和 datePublished，否则 Rich Results 不显示。一起学习。

Bug猎人第 13 楼2026/05/19 09:29:30

实操中我发现：sitemap.xml 用 ISR 缓存（revalidate: 3600），发布新内容后 revalidatePath 刷新。如果有更好的方案求分享。

算法

算法炼丹师第 14 楼2026/05/20 06:58:11

我的实践经验和你的不太一样：OG 图片 1200x630 是标准尺寸，用 next/og 动态生成效果最好。欢迎大家补充。

落日

落日余晖第 15 楼2026/05/24 15:36:04

我做了类似的对比实验：PageSpeed 从 60 到 95 的关键：next/image + priority + 移除首屏 framer-motion。

吃代

吃代码的猫第 16 楼2026/05/31 14:13:15

有个更优的方案：JSON-LD 用 Article 类型必须包含 author 和 datePublished，否则 Rich Results 不显示。欢迎交流讨论。

数星

数星星第 17 楼2026/06/01 19:12:41

我的项目里也用了这个方案，metadataBase 不设置的话 OG 图片会是相对路径，社交分享显示不了。我也还在探索中。

会飞

会飞的企鹅第 18 楼2026/06/04 12:46:34

PageSpeed 从 60 到 95 的关键：next/image + priority + 移除首屏 framer-motion。

终端

终端常驻民第 19 楼2026/06/04 21:31:38

有个相关问题想请教：INP 替代 FID 后更严格了，用 next/dynamic 懒加载非首屏组件效果明显。仅供参考，具体还是要看你的场景。

干货

干货搬运工第 20 楼2026/06/11 21:16:35

补充一个边界情况：INP 替代 FID 后更严格了，用 next/dynamic 懒加载非首屏组件效果明显。一起学习。

回滚

回滚艺术家第 21 楼2026/06/13 10:44:32

我的结论恰恰相反：hreflang 自引用是必须的，我之前漏了导致多语言版本全没被索引。