What's new in Chrome DevTools 145-147

Chrome for Developers · Beginner ·🖌️ UI/UX Design ·8h ago
This video highlights the latest updates in Chrome DevTools from versions 145 to 147. Learn about new performance features for single-page applications, including improved tracking for soft navigations. Discover how to debug styles more effectively for web components and explore new functionalities for the Chrome DevTools MCP server. Plus, get a bonus tip on using regular expressions in filter bars. Chapters: 0:00 - Introduction 0:39 - Soft navigation markers in performance traces 0:58 - Improved line-level profiler timings 1:19 - Render blocking column in the Network panel 1:51 - Support for…
Watch on YouTube ↗ (saves to browser)

Chapters (10)

Introduction
0:39 Soft navigation markers in performance traces
0:58 Improved line-level profiler timings
1:19 Render blocking column in the Network panel
1:51 Support for @starting-style in CSS
2:23 Edit adopted stylesheets inline
2:36 Grid editor checkbox for dense
2:56 New features for the DevTools MCP server
4:00 Bonus tip: Filter styles using RegEx
4:30 Conclusion
CSS position property explained (static, relative, absolute, fixed, sticky)
Next Up
CSS position property explained (static, relative, absolute, fixed, sticky)
Coder Coder