feat(newChorme)

pages/modern-web-guidance.md

@@ -0,0 +1,47 @@
+# Modern Web Guidance：给编码 Agent 补现代 Web 知识
+
+<div class="grid grid-cols-2 gap-8 mt-8">
+
+<div class="card-red">
+<div class="font-semibold mb-3">问题</div>
+<div class="space-y-2 text-sm">
+
+- 浏览器能力每几周更新
+- 模型训练知识经常滞后
+- AI 容易写旧方案或复杂 polyfill
+- 兼容性和降级策略容易漏掉
+
+</div>
+</div>
+
+<div class="card-green">
+<div class="font-semibold mb-3">解法</div>
+<div class="space-y-2 text-sm">
+
+- 把现代 Web 指南装进 AI 工具
+- 查询 Baseline 和最佳实践
+- 给出 gotchas 与 fallbacks
+- 让 Agent 写“今天的 Web”
+
+</div>
+</div>
+
+</div>
+
+<div class="mt-8 card-blue text-sm">
+可以把它类比成：以前 Browserslist / Autoprefixer 帮构建工具查兼容性；现在 Modern Web Guidance 帮编码 Agent 查现代 Web 知识。
+</div>
+
+<!--
+这一页讲 Modern Web Guidance。
+
+我们现在用 AI 写前端代码，经常遇到一个矛盾：Chrome 和 Web 平台更新很快，但大模型的训练数据可能停留在过去。也就是说，我们在 2026 年问一个编码 Agent 写现代 Web，它可能仍然拿几年前的经验回答。结果就是，它会写旧语法、引入不必要的库，或者不知道某个现代 CSS 和 Web API 已经可以用了。
+
+Modern Web Guidance 的目标，就是把 Chrome 团队和社区维护的现代 Web 指南，作为技能包或知识包提供给编码 Agent。它不是替你写业务逻辑，也不是一个 UI 库；它更像一个本地的现代 Web 知识补丁。当 Agent 准备写代码时，它可以把现代 Web 的能力、兼容性、避坑点和降级方案注入上下文。
+
+可以用一个前端熟悉的类比来理解。以前 Browserslist 和 Autoprefixer 帮打包工具查目标浏览器，决定要不要加前缀、要不要转译。那时写代码的是人，构建工具负责查兼容性。现在写代码的人里多了 AI Agent，所以也需要一个机制帮 Agent 查现代 Web 知识，避免它用过时方案解决今天已经有原生能力的问题。
+
+举一个具体场景：你让 Agent 写一个弹出菜单，它可能会直接引入一个复杂的定位库，或者写一堆监听 scroll 和 resize 的坐标计算。如果它能检索到现代平台指南，就可能优先考虑 Popover API、Anchor Positioning，以及必要的 fallback。这样产出的不是“能跑的旧方案”，而是更接近今天平台能力的方案。
+
+所以这条线的价值不是炫技，而是工程治理：让团队里的 AI 代码产出更接近现代平台，而不是把历史包袱继续复制到新项目里。
+-->