For all their promise, artificial intelligence coding agents suffer from a fundamental flaw: they are historical creatures. Trained on vast archives of legacy code, outdated tutorials, and obsolete StackOverflow threads, these agents frequently generate web code that belongs in the previous decade. When tasked with styling a layout or building a component, they often default to complex JavaScript workarounds or deprecated CSS hacks, completely unaware of modern web APIs.
A growing movement in the web development community is trying to fix this legacy code trap. Web developer Brecht De Ruyte recently demonstrated how Google’s Modern Web Guidance skill set can be used to retrain the behavior of AI coding assistants. By pairing this guidance with custom design token skills, developers can force AI agents to write clean, modern, and ‘Baseline-aware’ HTML and CSS.
Aligning AI with Modern Web Standards
The core challenge with AI-generated code is that LLMs operate on statistical probability rather than real-time knowledge of browser support. Without intervention, an AI agent might write a heavy JavaScript scroll-listener or complex layout calculations when a modern, native CSS function could achieve the same result in a single line.
By feeding AI agents Google’s Modern Web Guidance, developers can establish a modern baseline for the code these models produce. De Ruyte’s approach demonstrates that when AI is equipped with these modern standards alongside custom design tokens, it can maintain design system consistency while actively respecting the current state of the web platform. Instead of generating outdated patterns, the AI learns to leverage native browser features.
The Power of Baseline-Aware Code
The importance of keeping AI agents updated is highlighted by the rapid evolution of the web platform itself. In August 2026, several powerful features officially achieved ‘Baseline’ status, meaning they are now fully supported across all core browser engines and are safe to use without complex fallbacks.
Among these is the :paused CSS pseudo-class, which allows developers to style media elements—such as audio and video—directly based on whether they are paused or loaded but not yet playing. This native CSS selector distinguishes active playback from transitional states like buffering or seeking, eliminating the need for custom JavaScript state trackers.
Another major addition is the sibling-count() CSS function. This function returns the total number of sibling elements sharing a parent, allowing child elements to calculate proportional layout dimensions dynamically using CSS calc(). Historically, achieving this kind of fluid, sibling-aware layout required heavy JavaScript execution or rigid, pre-defined stylesheets. Now, it can be handled natively by the browser’s rendering engine.
Eliminating the JavaScript Tax
The push toward modern standards is also about performance, particularly as the industry shifts toward optimizing metrics like Interaction to Next Paint (INP). Heavy JavaScript execution is a primary culprit behind poor page responsiveness. By teaching AI agents to favor native web platform features over script-heavy alternatives, developers can inherently build faster, more responsive websites.
A prime example of this transition is Declarative Shadow DOM, which has now reached ‘Baseline Widely available’ status after maintaining universal browser support for 30 months. Historically, encapsulating styles within web components required attaching shadow roots using JavaScript via Element.attachShadow(). This often led to ‘flashes of unstyled content’ (FOUC) and prevented search engines from easily indexing server-rendered components.
Declarative Shadow DOM solves this by allowing developers to define shadow roots directly in HTML markup using the <template> element with the shadowrootmode attribute set to ‘open’ or ‘closed’. This enables server-rendered web components to render instantly with encapsulated styles without relying on JavaScript, making them fully parseable by search engines and highly performant.
The Future of AI-Assisted Engineering
As AI agents become deeply integrated into the software development lifecycle, the goal is no longer just to generate code quickly, but to generate the *right* code. Left to their own devices, AI models will continue to propagate the technical debt of the past.
By actively guiding AI agents with frameworks like Modern Web Guidance and keeping them aligned with Baseline standards, the web community is establishing a new paradigm. The future of web engineering lies in teaching our digital assistants to build for the modern, standard-driven browser, ensuring that the next generation of the web is faster, cleaner, and built to last.