Modern Web Guidance: 让代码智能体告别过时模式

Show HN: Get your coding agent off ~2019 JavaScript, onto modern web primitives

Modern Web Guidance 是一套专为代码智能体设计的技能包,由 Google Chrome、Microsoft Edge、Mozilla Firefox 和 MDN 团队联合打造。它直接将最新的 Web 平台最佳实践和浏览器兼容性数据嵌入智能体的上下文,引导其摒弃 2019 年式的陈旧 JavaScript 模式,转而采用现代 Web 原生 API。通过覆盖 CSS 布局、性能优化、无障碍访问等 250 多项现代特性,它帮助开发者生成更轻量、高性能且符合生产标准的代码,彻底解决大模型因训练数据滞后而生成臃肿代码的痛点。

Modern Web Guidance 填补了这一空白,将专家精心策划的指导方针直接注入智能体的上下文窗口,引导其利用现代 Web 平台的强大能力,而非依赖过时的模式。
  1. surround

    这里有一份浏览器特性列表,skills 会告诉你的智能体使用这些特性,它们在 Chrome 中很稳定,但 Firefox 和 Safari 并不支持:

    CSS @function

    CSS calc-size()

    CSS interpolate-size

    CSS corner-shape

    CSS border-shape

    CSS flex-wrap: balance

    CSS text-fit

    CSS text-decoration-skip-spaces

    CSS scroll-axis-lock

    CSS scroll-target-group

    CSS :target-current

    CSS scroll-initial-target

    CSS container scroll-state queries

    scrollsnapchange 事件

    scrollsnapchanging 事件

    HTML focusgroup

    Element.startViewTransition()

    CSS view-transition-scope

    Interest Invokers (interestfor)

    LanguageModel (Prompt API)

    LanguageDetector

    Translator

    Summarizer API

    Window.fetchLater()

    Speculation Rules API

    Long Animation Frames API

    VisibilityStateEntry

    PerformanceSoftNavigation

    InteractionContentfulPaint

    Connection-Allowlist

    CSS url() integrity() modifier

    HTML meta name="text-scale"

    HTML template for

    HTML processing instructions

    PasswordCredential

    Promise-returning scroll methods

    Web App Origin Migration

    Local Network Access permissions

    Request.targetAddressSpace

    beforeinstallprompt 事件

    公平地说,skills 也推荐了大约 11 个 Chrome 本身都不支持的特性。而且这个项目似乎确实关心兼容性问题:“引导模型使用合理、轻量级的降级方案。”

  2. bakkoting

    > 如果发现任何错误或奇怪的地方,请告诉我们!

    但具体怎么联系呢?希望是在 modern-web-guidance-src 仓库提交 issue 吧?不管怎样,我已经提交了一个,建议用 fromBase64 和 toBase64 替代 atob 和 btoa。

    不过既然你们已经全面拥抱智能体了,那就应该考虑让一个智能体去检查过去 3-5 年里 JS、DOM 和 HTML 规范的所有提交,自动分类那些明显是改进但智能体尚未使用的特性。这应该挺简单的。

    ---

    顺便说一句,我觉得如果能根据目标浏览器自动提供不同版本的指南会非常有帮助。例如,我不想使用那些在所有常青树浏览器中至少一年都没有普及过的特性;我想大多数开发者都有类似的标准,或者至少不想使用最前沿的特性。虽然从你们的仓库里获取这些信息是 _可能_ 的,但这需要一些工作,要么写个脚本,要么让智能体对每个特性自行判断。这些工作本可以由你们来完成,从而省去我们其他人的麻烦。

  3. simonw

    分发建议:除了你们现有的 npm 包,请设置 GitHub Pages 来发布技能的 Markdown 索引文档,地址为 https://googlechrome.github.io/modern-web-guidance-src/skill...(目前显示 404)。

    该索引页应链接到所有文档的纯 Markdown 版本,并设计为适合通过 grep 搜索以找到正确答案。

    这样我就完全不需要安装任何东西了——只要我的智能体具备发起 HTTP 请求的能力,我就可以告诉它“去 https://googlechrome.github.io/modern-web-guidance-src/skill... 查找提示”,它就会获取索引,然后导航到最相关的文档——完全不需要 MCP 或 npm 或任何安装步骤。

  4. advisedwang

    Chrome 在浏览器标准领域已经拥有太大的话语权了。我们最后需要的,就是让所有人的 LLM 都遵循 Chrome 团队关于如何进行 Web 开发的指导。这条路只会把我们带回到“要查看此网站,请使用 [主导浏览器] 查看”的时代。

  5. hackerbrother

    这不能用一个确定性的 linter 来解决吗?

同日更多故事

2026-11-10