This demo illustrates how WebMCP enables an AI agent to navigate a maze autonomously by using tools that were dynamically registered by the site, and that it needs to interact with the page in real-time. The Technical Shift: Dynamic Tool Discovery: Instead of hard-coding every action, the website registers new capabilities (move, look, use) as the environment evolves. High-Level Orchestration: Provide the goal ("Escape the maze"), and the agent uses primitives provided by the website to execute the plan. Real-time Debugging: Using the Model Context Tool Inspector to monitor registered tools, tool calls and agent logic as they happen.
Chrome for Developers
Technology, Information and Internet
Helping you build, grow, and innovate on the web.
About us
The official Chrome for Developers LinkedIn account from Google. We want to help you build beautiful, accessible, fast, and secure websites that work cross-browser, and for all of your users.
- Website
-
https://developer.chrome.com/
External link for Chrome for Developers
- Industry
- Technology, Information and Internet
- Company size
- 5,001-10,000 employees
Updates
-
10,000 videos processed daily with WebGPU + WebCodecs → https://goo.gle/4biAsbg In our latest case study, we look at how Sam Bhattacharyya built Free AI Video Upscaler and reached 250,000 Monthly Active Users while keeping server processing costs at exactly $0. By shifting the heavy lifting to the browser, the app now processes over 30,000 hours of video monthly without a single cloud GPU bill.
-
-
Pinterest shifted to native CSS carousels by integrating new primitives—including scroll buttons, scroll markers, scroll snap, and styleable fragmentation—to create smooth and more performant experience → https://goo.gle/4cZR6Pk By prioritizing new CSS carousel over legacy JavaScript, the team achieved: 90% reduction in codebase complexity (2,000 lines of JS → 200 lines of CSS) ✂️ 15% improvement in page load times 🚀 Smoother, native-feeling interaction 🌐 Beyond these wins, Pinterest is also experimenting with the View Transition API to further evolve their UI. This is a great example of how using modern CSS can reduce technical debt while improving the user experience.
-
Chrome 146 is now stable, bringing significant updates to the web platform’s security and developer experience → https://goo.gle/4sHVbwb Key highlights: The Sanitizer API: A native browser primitive designed to eliminate XSS vulnerabilities by stripping executable scripts from user-supplied HTML. Scoped Custom Element Registries: Solves the "naming collision" problem in Web Components, allowing different parts of an application to use different versions of the same custom element. Scroll-Triggered Animations: Moves scroll-position logic from JavaScript into declarative CSS, improving performance and reducing main-thread overhead.
-
🎙️ Join André Cipriani Bandarra and Francois Beaufort on the WeAreDevelopers podcast as they discuss the challenges of the agentic web and how WebMCP is bridging the gap between models and the browser → https://goo.gle/3ZWqkzu They'll go in depth on topics like: 🛠️ Structured Tooling: Replacing visual scraping with the navigator.modelContext API. 🤖 Declarative Agent Support: How to make any HTML form "agent-ready" with simple annotations. 🌐 Native Reliability: Shifting agent logic to the client for better performance and human-in-the-loop trust. and more!
-
Implementing the corner-shape property was more than just adding a new CSS feature, it was a journey through the internals of the rendering engine → https://goo.gle/46DW9kz We’re sharing the specific technical lessons and engineering hurdles encountered while bringing native curved and scooped corners to the web 📐
-
-
Modern frameworks can streamline your extension development process. However, frameworks focused on Server Side Rendering might not be the right fit for extensions. Get the full guide on choosing the right stack today from Oliver D. → https://goo.gle/4uAtFlV
-
Our latest Learn AI module guides you through every phase of the process, helping you evaluate whether predictive AI is the optimal choice for your specific use case → https://goo.gle/4aCvTJL What you'll explore in the Predictive AI cycle: 🎯 Defining Opportunity: Identifying where predictive models provide the most value. 📊 Data & Training: Preparing high-quality datasets for model development. ✅ Evaluation & Deployment: Measuring performance to ensure reliable, production-ready systems.
-
-
🍕 This #PiDay, we're shipping a literal pizza pie with our WebMCP "zaMaker!" demo to show how structured tool calls change the game → https://goo.gle/3PaAVEL To get started with the demo, you'll need to: Enable the flag: chrome://flags/#enable-webmcp-testing Install the Model Context Tool Inspector extension. Once you're in, tell us what "pi" you’d build and share your results in the comments below!
-
Decide between WebMCP and MCP for your next build → https://goo.gle/40ZV4Qw Find the best fit for your AI architecture: 🧭 WebMCP for frontend interaction 📡 MCP for backend workflows ✨ Optimization for browser agents
-