Independent AI intelligence Two editions daily · ET
Fervor AI
Menu

Analysis · November 11, 2026 · repo

GoogleChrome/modern-web-guidanceai-skillsclaude-codecodex

Modern Web Guidance: Your Coding Agent Doesn't Have to Write 2019 JavaScript Anymore

Your agent learned front-end work from years of old code. A free skill pack from the Chrome team hands it current guides, one task at a time.

Ask a coding agent to build a modal dialog and there's a fair chance you'll get a pile of JavaScript managing focus, a custom overlay and a scroll lock. Modern browsers handle much of that natively now, through the built-in <dialog> element. The agent isn't lazy. It learned web development from the code that existed when it was trained, and most of that code was written before the modern way existed.

The Show HN post that put the fix on the front page named the problem bluntly: getting your coding agent "off ~2019 JavaScript." The fix is Modern Web Guidance, an open set of skills that feeds coding agents current, browser-checked guides at the moment they write code. Its Show HN post reached the Hacker News front page on November 10 and was near 390 points a day later (HN).

The interesting part isn't the guides. It's the shape of the fix. Instead of waiting for a model that knows more, or pasting a giant rules file into every prompt, the agent looks up one small, current answer when it needs it. A dated memory plus a current lookup beats a bigger dated memory. The project's own tests suggest that small lookup moves results a lot.

What it actually is

Modern Web Guidance is a bundle of "skills" plus a small command-line tool. A skill, in this world, is a folder of instructions a coding agent such as Claude Code or Codex can load when a task calls for it, instead of carrying it in every conversation.

Chrome's docs describe it as "a set of skills that embed web platform expertise, best practices, and browser compatibility data directly into your coding agents" (Chrome for Developers). Per the README, it covers 250 modern web features (140 in CSS and layout, 36 in HTML and the DOM, 74 in JavaScript and browser APIs) and 203 real-world use cases, grouped under topics like accessibility, forms, performance, security, UI components and WebMCP (README).

The package is Apache-2.0 licensed, while the README's license section puts the guide content itself under CC-BY 4.0, which matters if you plan to copy guides into your own docs. It had roughly 3.5k to 3.8k stars on November 11, 2026, depending on where you count. The CLI needs Node.js 22 or newer (package.json).

One thing to know before you get excited about novelty: the project isn't brand new. Chrome's docs page for it was already circulating on Hacker News in May. What's new this week is the open repo and its eval numbers getting a wide audience.

How it works, in plain terms

Picture a reference librarian who sits next to your agent. The agent doesn't memorize the library. When it hits a task, it asks the librarian one question, gets one short page back, and keeps working.

In practice that's three steps:

  1. The agent turns on the skill when the task involves web front-end work.
  2. It searches a local index for a guide that matches the task. The README says the search runs offline, using a small built-in embedding model (a way of matching by meaning, not exact words) plus BM25, a classic keyword-ranking method. No API key and no model calls. One catch: the CLI sends anonymous usage telemetry by default, including the search queries the agent generates (more on that below).
  3. It retrieves just that guide into its working memory (the context window) and writes code from it.

The guides also lean on Baseline, a shared project that tracks which web features work across the major browsers. The README says the skills use "real-time compatibility data from the Baseline project so agents dynamically adapt to current browser support." So the agent isn't only told the modern way. It's told whether the modern way works in the browsers you care about.

Why does retrieval matter? Because the alternative is stuffing everything into an always-loaded instructions file, such as AGENTS.md or CLAUDE.md. Those files cost tokens on every turn and get skimmed. A guide that loads only for the dialog task, and only that guide, stays sharp.

What the numbers say

The README includes an eval table (an eval is a repeatable test run, here the maintainers' own before-and-after test of agents with and without the guidance). The most recent rows, from a November 8 run, read:

  • Claude Code on Opus 5.5: 57% of tasks passed without guidance, 88% with it (31 points up), across 215 tasks.
  • Codex CLI on GPT-6.1 Sol: 54% to 82% (28 points up), 215 tasks.
  • Antigravity CLI on Gemini 4 Argon: 58% to 94% (36 points up), 214 tasks.

The README frames this with two terms worth borrowing. The "opportunity" is how much room an agent had (100% minus its unguided pass rate). The "uplift" is how much the guidance closed (guided minus unguided). Earlier rows from November 2 to 6 show uplifts in the same rough range. The test setup compares "pass rates and accessibility w/ and w/o the skill," and a public eval dashboard carries the per-agent breakdowns.

Read those as a claim from the people who built the thing, measured on tasks they wrote. That doesn't make them wrong. It makes them a starting hypothesis for your own codebase.

Put this into practice

You can have it running in a few minutes. Pick the install path for your agent.

Claude Code (from inside a Claude Code session):

/plugin marketplace add GoogleChrome/modern-web-guidance
/plugin install modern-web-guidance@googlechrome
/reload-plugins

The README also suggests opening /plugin, selecting the GoogleChrome marketplace and turning on AutoUpdate, so the guides stay current.

Codex:

codex plugin marketplace add GoogleChrome/modern-web-guidance
codex plugin add modern-web-guidance@googlechrome

Any agent, with an interactive wizard:

npx modern-web-guidance@latest install

The README lists other routes too, including npx skills add GoogleChrome/modern-web-guidance and gh skill install GoogleChrome/modern-web-guidance, plus install blocks for GitHub Copilot CLI and Google Antigravity.

Try the lookup by hand first. It's the fastest way to see what your agent will see:

npx modern-web-guidance@latest search "animate a dialog modal backdrop"
npx modern-web-guidance@latest retrieve "animate-to-from-top-layer"

The first command returns matching guides. The second prints one guide in full. If the guide reads like something you'd want a junior developer to follow, the skill is worth keeping on.

Then scan your existing code:

npx modern-web-guidance@latest legacy-scan .

The README describes this as a way to "scan a codebase for legacy patterns to modernize." Run it before you hand an older front-end to an agent, so you know which files it's likely to copy bad habits from.

Make the agent show its work. Because skills load only when the agent decides they're relevant, add one line to your project's always-loaded instructions file (CLAUDE.md for Claude Code, AGENTS.md for Codex):

For any HTML, CSS or browser JavaScript task, search Modern Web Guidance
before writing code, and name the guide you used in your reply.

That one line does two jobs. It nudges the agent to actually look things up, and it leaves a trail. If a reply names no guide, you know the agent skipped the lookup, and you can ask it to try again. It costs a sentence of context on every turn, which is a fair trade for knowing whether the tool is doing anything at all.

Run your own small eval. This is the step most people skip, and it's the one that tells you whether the 31-point jump holds for your work. Pick five front-end tasks you've actually done recently: a form with validation, a dropdown, a lazy-loaded image grid. Have your agent do each one with the skill turned off, then on. Check three things: does it work, does it pass an accessibility check like your browser's built-in audit, and how much custom JavaScript did it write. You'll learn more from those ten runs than from any README.

Honest limitations

The eval numbers are self-run. Google wrote the tasks, the graders and the guidance. A 31-point uplift on their suite tells you the skill is aimed well at their idea of good front-end work. It doesn't tell you how it does on your design system or your legacy code.

It only covers the web platform. It won't fix your state management, your API layer or your tests. If an agent's front-end output is bad because the task was vague, a better guide won't save it.

The agent has to use it. Skills load when the agent decides they're relevant. If your agent doesn't trigger the skill on a task, you get the old behavior with no warning. Watch the first few sessions to see whether it actually searches.

Telemetry is on by default. According to the README, Google collects install counts, the calling agent's name, guide IDs and the search queries your agent writes, though not your raw prompts. If your front-end work is under NDA, set DISABLE_TELEMETRY=1 in your shell profile before the first run.

legacy-scan is thinly documented. The README shows the command and a one-line comment, and nothing about its output format or flags. Treat its findings as a to-do list to review, not a verdict.

And it's a Google project steering agents toward the web platform as Chrome sees it. Baseline data is cross-browser, which helps. Still, "modern" is an opinion, and some teams will reasonably prefer a framework's way over the platform's way for a given component.

The bigger idea

Every coding agent carries a snapshot of the world from its training data, and that snapshot ages the day the model ships. Bigger models don't fix that. They just have a bigger, equally dated snapshot.

Modern Web Guidance points at a cheaper pattern you can copy for any fast-moving area: a small, current, searchable set of guides that the agent pulls in one at a time, plus a test that shows whether it helped. Your internal libraries, your API conventions and your security rules all age the same way the web does.

Try it on five tasks this week. If the numbers hold for you, keep it. If they don't, you've learned something the README couldn't tell you.

Sources: GoogleChrome/modern-web-guidance README, main branch as of Nov 11, 2026; Modern Web Guidance eval dashboard; Chrome for Developers, Modern Web Guidance; Show HN thread, Nov 10, 2026.