必须用字符串数组传入entryTypes，如["navigation","paint"]；错误写法包括字符串拼接或字段名错为type；常用组合有三组且需检查浏览器支持；buffered对longtask等类型无效；回调中须先判entry.entryType再取字段。
必须用数组传入多个类型，不能用字符串拼接或多次调用 observe()；否则部分类型会漏监听，尤其是 navigation 和 paint 这类只触发一次的条目。
entryTypes 必须是数组，不是字符串或对象
很多人写成 observer.observe({ entryTypes: "paint" }) 或 { type: "navigation" }，这会导致 TypeError 或静默失败。浏览器只认 entryTypes 字段，且值必须是字符串数组。
- ✅ 正确：
observer.observe({ entryTypes: ["navigation", "paint"] }) - ❌ 错误：
observer.observe({ entryTypes: "navigation,paint" })（字符串不解析） - ❌ 错误：
observer.observe({ type: ["navigation"] })（字段名错，应为entryTypes）
哪些组合最常用，又不会互相干扰
全量监听所有类型既没必要，还会拖慢主线程。实际项目中，以下三组组合覆盖 90% 场景，且语义清晰、互不重叠：
-
["navigation", "paint"]：用于首屏加载性能（FCP、TTFB、DOM 解析耗时），navigation提供基准时间轴，paint提供渲染节点 -
["largest-contentful-paint", "first-input"]：专用于 Core Web Vitals 上报，LCP 和 FID 都是单次事件，需独立 observer 或至少分开处理逻辑 -
["longtask", "layout-shift"]：用于交互卡顿诊断，但注意layout-shift在 Safari 中不支持，上线前必须用PerformanceObserver.supportedEntryTypes.includes("layout-shift")检查
buffered: true 不是万能的，得看类型是否支持缓存
加 buffered: true 能捕获 observer 创建前已生成的条目，但它对某些类型无效：
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- ✅ 有效：
navigation、paint、largest-contentful-paint（浏览器会缓存早期条目） - ❌ 无效：
longtask、event（任务执行完即丢弃，不缓存） - ⚠️ 注意：
resource条目虽可缓存，但数量爆炸，开启buffered后可能占满 150 条默认 buffer，导致新条目被丢弃
一个 observer 处理多种类型时，回调里怎么安全区分
不能只靠 entry.name 判定类型——比如 paint 条目的 name 是 "first-contentful-paint"，而 navigation 条目没有 name 字段，直接访问会报错。
- ✅ 安全做法：先用
entry.entryType分支判断，再读对应字段if (entry.entryType === "navigation") { ... } else if (entry.entryType === "paint") { ... } - ❌ 危险写法：
if (entry.name === "first-contentful-paint")（navigation 条目无name，报Cannot read property 'name' of undefined） - ⚠️ 特别注意：
largest-contentful-paint的entryType是"largest-contentful-paint"，不是"paint"，别漏掉这个独立类型
最容易被忽略的是：多个类型共用一个 observer 时，只要其中一种类型不被当前浏览器支持（比如 Safari 不支持 longtask），整个 observe() 调用就会失败，后续类型也监听不到。所以务必在 observe() 前逐个检查 PerformanceObserver.supportedEntryTypes。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
