contain-audit

用途：自动找出在 DOM 元素上添加 contain: layout style 后能减少浏览器重算开销的候选元素，属于性能审计工具。主要能力：在真实浏览器中加载大型工作流（245 节点）；遍历 DOM 为每个元素评分为包含候选；对高分候选通过 JavaScript 应用 contain: layout style；对比应用前后的渲染性能（样式重算、布局次数、任务时长）；截取前后截图以检测视觉破坏；生成带建议的排名报告。使用方式：先启动开发服务器 pnpm dev &，再运行 pnpm exec playwright test browser_tests/tests/containAudit.spec.ts --project=audit（使用 @audit 标签，不在常规 CI 运行），最后用 pnpm exec playwright show-report 查看 HTML 报告。结果表格含 Rank、Selector、Subtree（后代元素数）、Score、DRecalcs、DLayouts、Visual 列，负值表示性能改善，Visual 为 OK/DIFF。候选评分标准：子树大、尺寸受外部约束（CSS 变量、flex 或显式值）、未应用 contain、非叶子节点。不适用：子元素视觉溢出（如负 inset 的绝对定位浮层）、高度由内容决定且影响兄弟布局、子树过小。限制：无法完全保证 contain 安全，需人工查看截图；性能测量有自然波动，建议多次运行；仅测试空闲和平移场景，组件交互可能有差异；通过 JS 运行时修改样式，不考虑 Tailwind 清除或构建优化。示例 PR #9946 为节点内层包装添加 contain-layout contain-style。相关文件位于 browser_tests/ 下。