That index page should link to plain markdown versions of all of the documents, and should be designed for search with grep to find the right answers.
That way I don't have to install anything at all - provided my agent has the ability to make HTTP requests I can tell it "Look for tips on https://googlechrome.github.io/modern-web-guidance-src/skill..." and it will fetch the index, then navigate to the most relevant documents - no MCP or npm or installation required at all.
Aye. I like the idea, Simon. The token cost of the index is high enough I wouldn't suggest the technique for regular use but.. agree that for occasional users it should suffice.
> That way I don't have to install anything at all
It feels that something like this would be the holy grail of agents. A small agent that has only the minimum necessary built in knowledge. The rest, it just retrieves on the fly when it needs (+ caching)
It’s like storing pointers/links instead of the contents
Chrome already has too much power in the browser standards world. The last thing we need is everyone's LLMs to follow Chrome team's guidance on how to do web development. This road leads back to "To view this site, please view in [DOMINANT BROWSER]"
Mozilla Firefox and Microsoft Edge are also contributors to this project, so this is a cross-browser initiative to help improve how agents build for the web.
Both Mozilla and the Google Chrome team are part of the Web Baseline project and this project. They only recommend best practices supported by Chrome, Firefox, Edge, and Safari.
IMO maintainability is the next frontier. If we just allow coding agents to accrete 1k-LOC solutions to problems, the codebases run quick away from our ability to maintain _some_ level of understanding.
So I'll take a 1-line CSS solution over 60 lines of ResizeObserver/setTimeout business. But.. best practices for frontend isn't just the code.. it's ensuring quality UX, that keyboard navigability works, that layout doesn't shift on users.
The "modern web primitives" are also not even necessarily the "best practice".
Browser-specific implementation gotchas tend to take about a decade to iron out for reasons that never have anything to do with code quality. Users are fickle and so are browser vendors, but that's a different topic.
At the end of the day, there's just no escaping lots of manual testing across device and browser combinations if your goal is a polished result and not just something that "works".
AI has done nothing to make this problem go away. If anything, it's made it worse because people don't even want to look at the code now!
Ugh it is Uncle Bob, not going to torture AI with this guy.
But the fun part is that all of the proper software engineering practices are aimed at lowering amount of context a developer has to keep in his mind. So it directly applies to agent context. Less verbose code, less tokens to burn, separation of concerns, lower chance agent breaks something unrelated etc.
I am not generally against using AI to reduce the amount of information you need to pay attention to, and I was not joking. There are multiple places in that interview with good articulation of the reasons why software fundamentals still matter, and what happens when you don't look at at least some of the AI-generated code.
These skills look better than most, but running my code through the legacy scan only found two issues. So while I still think training beats skills, I'm sure this has its place, especially with weaker models.
Yeah. The legacy scan is tuned to 1) focus on cases where there's a clearly detectable legacy pattern and 2) avoid false-positives. This means it only overlaps with 20% of all the skill's docs. (We'll probably get it to ~50% in another month).
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..
This is exactly what I need when I need it. The amount of pull requests I reviewed with a mess of codes that can be switched to 2 lines of modern features made me write such tools myself, only half assed since I have other things to do.
This is a great idea. I think while so much was being built out in the JavaScript ecosystem, awareness about the equivalent feature releases that were done to HTML, CSS, web components, and other technologies didn't keep pace.
Of course, it's not perfectly implemented the same in every browser, but that's nothing new.
I treat all my code as some kind of stochastic machinery. So atleast one stage, I'd just tell an agent to go through and follow the guide.
But I'd not inject all this fluff into the wheels of the machine because it'd just take the "average" of these practices which would be just as useless.
Distribution suggestion: in addition to the npm packages you have right now, set up GitHub Pages to publish a markdown index document of the skills at https://googlechrome.github.io/modern-web-guidance-src/skill... (currently a 404)
That index page should link to plain markdown versions of all of the documents, and should be designed for search with grep to find the right answers.
That way I don't have to install anything at all - provided my agent has the ability to make HTTP requests I can tell it "Look for tips on https://googlechrome.github.io/modern-web-guidance-src/skill..." and it will fetch the index, then navigate to the most relevant documents - no MCP or npm or installation required at all.
https://developer.chrome.com/docs/modern-web-guidance/guides...
(we could make this clearer though)
Aye. I like the idea, Simon. The token cost of the index is high enough I wouldn't suggest the technique for regular use but.. agree that for occasional users it should suffice.
We'll make this happen. :)
> That way I don't have to install anything at all
It feels that something like this would be the holy grail of agents. A small agent that has only the minimum necessary built in knowledge. The rest, it just retrieves on the fly when it needs (+ caching)
It’s like storing pointers/links instead of the contents
What’s the point of modern Javascript without over complicating things?
Chrome already has too much power in the browser standards world. The last thing we need is everyone's LLMs to follow Chrome team's guidance on how to do web development. This road leads back to "To view this site, please view in [DOMINANT BROWSER]"
Mozilla Firefox and Microsoft Edge are also contributors to this project, so this is a cross-browser initiative to help improve how agents build for the web.
Both Mozilla and the Google Chrome team are part of the Web Baseline project and this project. They only recommend best practices supported by Chrome, Firefox, Edge, and Safari.
https://web-platform-dx.github.io/baseline/
Calm your pitchfork, Mozilla and Edge are both part of Modern Web Guidance.
https://github.com/GoogleChrome/modern-web-guidance-src/blob...
"Best Practices" are pretty much dead in the AI era. Pretty soon no one is going to read any of the code AI produces and that's a scary thought.
IMO maintainability is the next frontier. If we just allow coding agents to accrete 1k-LOC solutions to problems, the codebases run quick away from our ability to maintain _some_ level of understanding.
So I'll take a 1-line CSS solution over 60 lines of ResizeObserver/setTimeout business. But.. best practices for frontend isn't just the code.. it's ensuring quality UX, that keyboard navigability works, that layout doesn't shift on users.
Best practices are not dead if they result in better user experience. The focus is less on developer ergonomics though - true that.
The "modern web primitives" are also not even necessarily the "best practice".
Browser-specific implementation gotchas tend to take about a decade to iron out for reasons that never have anything to do with code quality. Users are fickle and so are browser vendors, but that's a different topic.
At the end of the day, there's just no escaping lots of manual testing across device and browser combinations if your goal is a polished result and not just something that "works".
AI has done nothing to make this problem go away. If anything, it's made it worse because people don't even want to look at the code now!
>Pretty soon no one is going to read any of the code AI produces and that's a scary thought.
This is a misconception. Have your favorite agent summarize this video for you: https://www.youtube.com/live/zcLPGC-tvgk?si=YR68aHlFESD053bh
Ugh it is Uncle Bob, not going to torture AI with this guy.
But the fun part is that all of the proper software engineering practices are aimed at lowering amount of context a developer has to keep in his mind. So it directly applies to agent context. Less verbose code, less tokens to burn, separation of concerns, lower chance agent breaks something unrelated etc.
>>Pretty soon no one is going to read any of the code AI produces and that's a scary thought.
>This is a misconception. Have your favorite agent *summarize this video for you*: https://www.youtube.com/live/zcLPGC-tvgk?si=YR68aHlFESD053bh
I can't tell if you're joking here
I am not generally against using AI to reduce the amount of information you need to pay attention to, and I was not joking. There are multiple places in that interview with good articulation of the reasons why software fundamentals still matter, and what happens when you don't look at at least some of the AI-generated code.
Planning to give this one a wide berth.
The more "legacy code" is getting written everyday the more the web will be forced to remain backwards compatible...
I added this a few months ago and Claude Doctor has not removed it. It must be working and getting use.
These skills look better than most, but running my code through the legacy scan only found two issues. So while I still think training beats skills, I'm sure this has its place, especially with weaker models.
Yeah. The legacy scan is tuned to 1) focus on cases where there's a clearly detectable legacy pattern and 2) avoid false-positives. This means it only overlaps with 20% of all the skill's docs. (We'll probably get it to ~50% in another month).
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..
Finally.
This is exactly what I need when I need it. The amount of pull requests I reviewed with a mess of codes that can be switched to 2 lines of modern features made me write such tools myself, only half assed since I have other things to do.
What's the best way to introduce this to a Gemini chat?
This is a great idea. I think while so much was being built out in the JavaScript ecosystem, awareness about the equivalent feature releases that were done to HTML, CSS, web components, and other technologies didn't keep pace.
Of course, it's not perfectly implemented the same in every browser, but that's nothing new.
I treat all my code as some kind of stochastic machinery. So atleast one stage, I'd just tell an agent to go through and follow the guide.
But I'd not inject all this fluff into the wheels of the machine because it'd just take the "average" of these practices which would be just as useless.