Mathias Bynens

22.8K posts

Mathias Bynens

Mathias Bynens

@mathias

♥ JavaScript, HTML, CSS, HTTP, performance, security, Bash, Unicode, i18n.

https://mastodon.xyz/@mathias Katılım Ocak 2007
1.2K Takip Edilen65K Takipçiler
Sabitlenmiş Tweet
Mathias Bynens
Mathias Bynens@mathias·
At #io19, @_gsathya and I gave a talk on cutting-edge JavaScript features: youtube.com/watch?v=c0oy0v… ➡️ WeakRef ➡️ Intl.* ➡️ Promise.{allSettled,any} ➡️ numeric separators ➡️ Array#{flat,flatMap} ➡️ Object.fromEntries ➡️ String#matchAll ➡️ …and more!
YouTube video
YouTube
English
47
147
563
0
Addy Osmani
Addy Osmani@addyosmani·
Chrome just became massively more agent-friendly 🔥 Your real, signed-in browser can now be natively accessible to any coding agent. No extensions. No headless browser. No screenshots. No separate logins. Just one toggle to enable it. Check this out: developer.chrome.com/blog/chrome-de…
Peter Steinberger 🦞@steipete

New @openclaw beta is up: it comes with the new live browser control that Google added in latest Chrome! enable via chrome://inspect#remote-debugging Your clanker will know when to use what, or you can ast it. new "user" profile session is there! developer.chrome.com/blog/chrome-de…

English
66
149
1.8K
312.5K
Mathias Bynens
Mathias Bynens@mathias·
@addyosmani @alperortac Currently chrome-devtools-mcp supports global network throttling, but not on a per-request basis (yet). To help us prioritize per-request throttling support in chrome-devtools-mcp, please file a feature request with a motivating use case here: github.com/ChromeDevTools…
English
1
0
2
434
Addy Osmani
Addy Osmani@addyosmani·
Chrome DevTools now supports *individual* network request throttling! Folks have been asking for this for years! DevTools now allows developers to simulate slow network conditions for specific requests rather than the entire page. This helps in testing how a web application performs and handles issues when specific resources (like images, scripts, or API calls) are slow to load.
English
74
396
3.2K
279.8K
Lindsey Simon
Lindsey Simon@elsigh·
@addyosmani @ChromeDevTools rn I see "Error: The browser is already running for /Users/elsigh/.cache/chrome-devtools-mcp/chrome-profile. Use --isolated to run multiple browser instances." (not sure how to pass a flag to chrome-devtools-mcp)
English
3
0
0
179
Mathias Bynens retweetledi
Addy Osmani
Addy Osmani@addyosmani·
Announcing @ChromeDevTools MCP! 🚀 Connect your AI coding agent to Chrome's powerful automation & debugging capabilities with ease. Key features: ✅ Reliable automation: It can programmatically handle clicks, form fills, dialogs, and page navigation with ease. ✅ Performance insights: Go beyond simple audits. Instruct your agent to record a performance trace and extract actionable insights to optimize your web apps. ✅ Advanced debugging: Empower your AI to analyze network requests, list console messages, take screenshots, and even evaluate scripts in the browser context. ✅ Browser emulation: Easily test different conditions by emulating CPU slowdowns, network throttling, or various screen sizes. Works well with modern web apps and believe this will unlock new workflows for automated testing, AI-driven debugging, and interactive web development. And there's much more to come!
English
74
298
1.8K
266.9K
Guntram Bechtold
Guntram Bechtold@guntrambechtold·
Wow! Thats how you can use Chrome DevTools MCP to glow-up Hacker News's minimalist aesthetic. And I'm not sorry. Its pure CSS chaos: rainbow gradients, spinning rank numbers, Comic Sans headers (48px!), bouncing links, glowing neon text effects. Even added floating emojis across the entire page. The fact that I can inject code and manipulate any webpage programmatically through this MCP integration is mind-blowing. This is the browser automation I've been waiting for. Seriously impressive work on this tool. Game changer. Love it. Thank you @mathias and team!
English
3
1
6
1.6K
Mathias Bynens retweetledi
Chrome for Developers
Chrome for Developers@ChromiumDev·
✈️💺 Fasten your seatbelts! DevTools got a turbocharged upgrade with the new AI assistance panel. Debug styling issues, understand layouts, and fix airplanes. Ready for take-off? ➡️ developer.chrome.com/blog/5-cool-th…
Chrome for Developers tweet media
English
0
14
55
9.7K
Mathias Bynens retweetledi
Addy Osmani
Addy Osmani@addyosmani·
Introducing AI Assistance in @ChromeDevTools! 🤯🚀 Ever wish you could have a coding buddy to help you with CSS and layout? Well, your wish is granted! The new AI Assistance in Chrome DevTools is here to make your life as a developer easier, powered by Gemini. The new panel aims to help you find and fix issues. Just ask it questions about your code, and it provides tailored explanations and even suggests solutions. This is our first exploration into agentic AI in DevTools and we're excited to hear what you think of it. Some key features: 1. Conversational prompts: Get tailored suggestions and code snippets. 2. Contextual understanding: AI understands the code you're working on. 3. Step-by-step guidance: Get help with everything from styling to debugging. Want to see it in action? Check out my screencast below to see how I used it to add a dark mode.
English
24
154
773
95.7K
Mathias Bynens retweetledi
Chrome DevTools
Chrome DevTools@ChromeDevTools·
✨ More Gemini is coming to DevTools! ✨ Try the new experimental AI assistance panel in Chrome Canary 131 and later to get help understanding layouts and debugging your CSS. Learn more at goo.gle/devtools-ai-as…
Chrome DevTools tweet media
English
13
145
655
150K
Mathias Bynens retweetledi
Phil Walton
Phil Walton@philwalton·
📢 New post: The State of ES5 on the Web. For years, we defaulted to transpiling to ES5 in order to support IE. But is that still necessary? I took a look at the data to find out, and I'll just say that the results were *actually* quite surprising! 🙀 philipwalton.com/articles/the-s…
English
4
47
143
23.4K
Mathias Bynens
Mathias Bynens@mathias·
@argyleink I’m intuitively assuming any browser code that parses HTML is more highly optimized than any browser code that parses these elaborate OpenType contextual alternates — but I haven’t actually measured this so I don’t know! cc @abrax5
English
0
0
1
443
Mathias Bynens
Mathias Bynens@mathias·
@argyleink Loving this! I wonder how this impacts rendering performance. One of the main reasons folks use build-time syntax highlighting with simple HTML + CSS is to minimize the runtime performance cost. This OTOH seems to put at least some of that cost (“parsing”) back on the user.
English
1
0
2
919
Mathias Bynens retweetledi
Adam Argyle
Adam Argyle@argyleink·
no pain syntax highlighting‽ - no JS - no markup transformation or tokenization how? via Colr Fonts 💪 try it! codepen.io/argyleink/pen/…
Adam Argyle tweet media
English
27
125
763
176.4K