Posted by paulirish 5 hours ago
Models know about some of these by name, but consistently won't default to using the platform-native solution and instead prefer the incumbent <div>+JS based pattern. We started an effort in Chrome to supplement coding agents with this key domain knowledge and we're shipping our 1.0 today, in collaboration with Firefox, MDN, and Edge.
200+ guides (~1.7MB) of curated, hand-crafted implementation best-practices from web experts, updated as the web evolves. (Open source, obv, so.. we'll welcome your bikeshedding ;) Readable versions here: [1]
I've spent the last 9 months obsessing over how to ship this as an agent skill + (Agentic RAG) CLI without blowing up your context window. (Or cedeing activation mechanics to MCP dynamic tool search). The skill description is minmaxed for activating on relevant frontend tasks. The RAG work I'm pretty proud of… originally a 500mb native stack down to a ~7MB pure-JS package, ~10ms search on your CPU.
We just introduced a deterministic 'legacy-scan' (trained on 30k github repos) to identify old 'n dusted patterns that your agent can modernize. (92% avg precision on held-out repos.)
People make a lot of claims about what coding agents are good/bad at. We wanted receipts, so we invested heavily in eval infra [2] to help us hill-climb, but also to identify when knowledge is common enough we can prune our guides. (Ofc, some of the things we thought AI didn't know turned out to be wrong :) We run codex/claude/agy against 200 tasks without the skill and then with.. In total ~1,700 playwright/AST-based assertions. Agents go from 55% pass unguided to 92% guided.
Try it out:
DISABLE_TELEMETRY=1 npx modern-web-guidance@latest install
DISABLE_TELEMETRY=1 npx modern-web-guidance@latest search "animate dialog modal"
DISABLE_TELEMETRY=1 npx modern-web-guidance@latest legacy-scan ./src
Longer write-up on the 1.0: https://developer.chrome.com/blog/modern-web-guidance-v1
---
0: https://news.ycombinator.com/item?id=50416456
1: https://developer.chrome.com/docs/modern-web-guidance/guides
On the other hand, a bit sad: programming nowadays is just arranging a bunch of Markdown files, possibly generated by another bunch of models.
Not so exciting, in the end.
In short: I 100% understand your disappointment. :) More coming soon like finding cases to update with Promise.withResolvers, the Array iterators, Object.groupBy, URLSearchParams, etc..
These concepts are new, so no one knows if they are any good. They're not modern -- who knows if they will even be put to use?
"contemporary", "proposed", "suggested", "compatible" are better fit. I wouldn't dare use "advanced" because many APIs and proposals actually regress earlier behavior.
There's a plugin for Antigravity that's listed on initial setup (yay bundleware! :) but... yeah if you're using consumer gemini, i'd switch to the Tasks mode because it's more agentic nature helps.
In fact I just did this and it works. :p It regular Gemini, it said it did but kinda liked :) So there it'd be
> Create a perfect HTML contact form with address fields. Check https://developer.chrome.com/docs/modern-web-guidance/guides... — read completely, don't stop at truncation.
Of course, it's not perfectly implemented the same in every browser, but that's nothing new.