Addy Osmani
@addyosmani
Former Engineering lead working on Gemini and Google Cloud AI I want you to win :) For more on what I'm up to, I'm at addyosmani.com
"The levels of AI adoption" - Orchestration requires a different skillset. I spoke about orchestrating coding agents at O'Reilly AI CodeCon this week - here's the full free write-up + slides on what makes multi-agent coding works: addyosmani.com/blog/code-ag... Illustration by Steve Yeggae
Announcing Gemini 3.1 Pro! Google's smarter model for your most complex tasks just shipped 🚀 A few web demos:
AI users are working longer because, for the first time, our tools can finally keep pace with our imagination. When output is cheap, your greatest leverage isn't how much you build, but the taste to know what is worth building - and the rest required to see the difference.
"Critical thinking in the age of AI": addyo.substack.com/p/critical-t... ~ my latest write-up on the importance of retaining critical thinking skills during these times ✍️
View Transitions are now in all browsers! They also landed in React! developer.chrome.com/blog/view-tr...
Announcing Chrome DevTools MCP! 🚀 Connect your AI coding agent to Chrome's powerful automation & debugging capabilities with ease. Learn more: developer.chrome.com/blog/chrome-...
New in Chrome DevTools: Instantly check CSS feature compatibility with Baseline! Chrome DevTools now displays the Baseline status for CSS properties right in the Elements panel - Baseline gives you clear info about which web features are ready to use today.
New in ChromeDevTools: Debug complex CSS values more easily! 🎉 The Elements > Styles tab now shows a tooltip on hover with: 1. A step-by-step evaluation of complex CSS calculations to trace values back to their origin! 2. The full definition chain of CSS variables!
New in Chrome DevTools: Gemini can modify and save CSS changes directly to your source! ✨ Modify and fix CSS within the Elements panel. 🧪 Instantly test changes live. 💾 Save changes back to your source files with a connected workspace folder. Learn more: developer.chrome.com/blog/new-in-...
Advanced React: Production case studies from ambitious web projects: largeapps.dev/case-studies... - our latest write-up!
Using AI in software development is not about writing more code faster - it's about building better software. I wrote a free ~60m read on leading effective teams through the age of GenAI: bit.ly/leet-ai ✍️
We released Canvas in Gemini this week, allowing you to code and preview React/JS components quickly. Here's a one-shot Stock market component 👀 Try it out: gemini.google.com
New in Chrome DevTools: Accurately emulate CPU performance of a low/mid tier phone with Automatic CPU throttling calibration! 📲 This feature calculates slow-downs for your specific device. Wanted this for years! We just shipped it.
Tip: Chrome DevTools can emulate a focused page! Great for debugging elements that disappear when they lose focus.
New in Chrome DevTools: Skip irrelevant scripts in the Flame Chart! Debugging is faster and more actionable 🙏
Introducing "Copy console" in Chrome DevTools: one-click copy all console messages. Useful for pasting into LLMs / AI Code Editors for better fixes.
"Your UI doesn't need to map one-to-one with your data's fields and values". Great thinking on simplicity from Steve Schoger
Must reads for web developers - how modern browsers work: 1️⃣ bit.ly/browsers-pt1 2️⃣ bit.ly/browsers-pt2 3️⃣ bit.ly/browsers-pt3 4️⃣ bit.ly/browsers-pt4 and browser.engineering a free to read book on the topic
"DOOM: The Gallery Experience" on the web. Try it: bobatealee.itch.io/doom-the-gal...
Want fireworks in your terminal? ❤️ Try `npx firew0rks` Source: github.com/addyosmani/f...
Tip: Chrome DevTools can override the content of Fetch/XHR requests! Useful for mocking APIs without waiting on backend changes.
Quickly turn a GitHub repository into text for LLMs with Gitingest ⚡️ Replace "hub" with "ingest" in any GitHub URL for a text version of the codebase. gitingest.com github.com/cyclotruc/gi...
Google's #Veo2 video generation model impresses. "SF drone footage. Hyperlapse during the night. Golden Gate bridge."
Great to hear form you, Ateş! Thanks for the feedback! I'm going to play around with the hover effect and border to make that look more clear. Apprec you checking it out!
"Free background-image remover in the browser!" ⚡️ Excited to announce bg.addy.ie, a free little app that removes backgrounds from images directly in your browser! Privacy-friendly. Uses Transformers.js, RMBG-1.4 & MODNet.
✍️ "Hard truths about AI-assisted coding" tips & tricks in my latest article: bit.ly/ai-assisted While AI-Assisted coding can get you 70% of the way there (great for prototypes or MVPs), the final 30% requires significant human intervention for quality and maintainability.
Tip: In Chrome DevTools, we added a new AI Assistance panel. Debug & tweak CSS using natural language prompts!
"Soft skill books that will make you a better developer" open.substack.com/pub/addyo/p/... Takeaways from some favorite books that have helped me grow over time.
✍️ AI coding tip: Automatically keep a log of what, why & how decisions were made. Great for education. > Make sure to keep a log of what, why and how you did what you did in fyi(dot)md. Keep it updated. Works well with Bolt, v0, Replit, Cursor, Cline etc.