📌 项目地址：GoogleChrome/modern-web-guidance-src | ⭐ 1,601 颗星 | 🔧 TypeScript
让 Copilot 写个弹窗动画，它给你引一个 JS 动画库；让它做居中布局，它翻出 jQuery 时代的招数。这不是模型笨，是训练数据里遗留代码太多，新 API 的占比太小。模型就算知道某个 API 存在，也缺乏真实项目里现代写法的积累，产出的代码往往不够 production-ready。
Modern Web Guidance 就是冲着这个问题来的。这是 Google Chrome 团队发起的项目，Microsoft Edge、Mozilla Firefox 和 MDN 三方团队一起参与维护，目前一千六百多 star（截至发稿）。它的做法很直接：提供一套 CLI，把专家审核过的指南塞进你的编码 agent 的上下文窗口，让模型别再走老路。
指南内容聚焦三个方向：
- 现代浏览器 API：纠正模型经常写错的 API 结构
- 性能与可访问性：优先用浏览器能优化、自带无障碍能力的平台级 API
- 合理的降级方案：引导模型用轻量 fallback，而不是重型 polyfill 或遗留库
怎么用
一条命令交互式安装：
npx modern-web-guidance@latest install
不装也能试。三个命令就够了解它能干什么：
# 搜索相关指南
npx modern-web-guidance@latest search "animate a dialog modal backdrop"
# 按 ID 取某篇指南
npx modern-web-guidance@latest retrieve "animate-to-from-top-layer"
# 扫描代码库，找出可以现代化的遗留模式
npx modern-web-guidance@latest legacy-scan .
legacy-scan 对存量项目最有用，它直接扫你的代码库，标出哪些地方还在用旧写法、可以升级。
和一堆 rules 文件比，强在哪
给 agent 喂精选上下文这件事，社区早有人在做：各种 awesome prompt 集合、rules 文件满天飞。这个项目有几个别家没有的东西。
第一，兼容性数据是一手的。四大浏览器团队（Chrome、Edge、Firefox、MDN）共同维护，不是社区二手整理。
第二，内容有质量闭环。仓库里包含编写（authoring）、校准（calibrating）、评估（evaluating）的完整代码，内容写完不算完，还要持续跑评测验证效果。指南本身按 token 效率设计，团队通过 evals 把模型已经会的“最低公分母”内容剪掉，只留真正的增量信息。这点对上下文窗口寸土寸金的 agent 场景很关键。
第三，输出直接面向上下文窗口设计。给人看的文档和给模型吃的文档是两种工程，这里做的是后者。
仓库分工说明
注意有两个仓库：modern-web-guidance-src 是源码仓库，面向贡献者，包含全部编写、校准、评测代码；日常使用走 GoogleChrome/modern-web-guidance 和官方文档（developer.chrome.com/docs/modern-web-guidance）。想贡献内容或了解项目治理，看仓库里的 CONTRIBUTING.md 和 GOVERNANCE.md。
我的看法
就算你不打算用它，这个项目也值得看一眼：它演示了一套“怎么给 LLM 注入领域知识”的完整方法论，包括如何用评测裁剪内容、如何量化“模型已经知道什么”。这套思路搬到任何垂直领域都成立。维护老项目想系统性排查现代化改造点的团队，也可以直接跑一遍 legacy-scan 看看结果。