呜啦!日常碎碎念,偶尔掉落优质前端博文推荐、学习资源等
网页:https://tg.cosine.ren
本频道的搜索Bot 来辣 👉 @cosSearchBot
私聊直接发消息就可以搜索啦~
🔖tags
#优质博文 #资源推荐 #博客更新 #碎碎念 #项目更新 #手工 #书摘 #阮一峰的科技周刊 #新动态

图频:Cosine 🎨 Gallery @CosineGallery
猫片: @cosine_cat
#新动态 #ChromeDevTools #前端 #调试 #性能优化 #AI
What's new in DevTools, Chrome 139

AI 摘要:Chrome DevTools 139 版本专注于提升开发者体验、生产力及工具可靠性,修复了大量已知问题并增强了测试覆盖率。此次更新亮点包括在 AI 辅助中支持上传图片以提供视觉上下文,在 Network 面板中新增请求头列,以及对核心面板如 Performance、Sources 和 Elements 的持续改进,同时优化了各种调试和辅助功能,旨在提供更流畅、更稳定的开发工作流程。

1. 工具性能与稳定性改进
• 核心开发体验提升: 本版本优先提升产品卓越性,解决了大量已知问题,包括长期存在的视觉故障、可用性问题和设计不一致,将开放问题数量减少了 27%。
• 幕后测试覆盖率增强: 大幅提升了 DevTools 的测试覆盖率,调查并修复复杂的测试失败,并将测试相关问题减少了 54%,从而带来了更流畅、可靠和高效的日常调试和开发工作流程。

2. AI 辅助与智能功能
• AI 辅助支持图片上传: 在 AI 辅助面板中,现在不仅可以自动截屏,还可以上传任意图片到与 Gemini 的聊天中,为提示提供额外的视觉上下文。
• Google I/O 2025 亮点整合: 强调了在 Google I/O 2025 中展示的新 DevTools 功能,包括 Sources 面板连接工作区并保存修改、Gemini 驱动的 CSS 修改和保存、查询性能洞察、自动标注性能发现,以及新的性能洞察功能(重复 JavaScript 和遗留 JavaScript)。

3. 开发者工具面板更新
• Network 面板增强: 在 Network 面板中,现在可以右键点击请求表格中的列名,并选择多个请求头将其添加为列。
• Application 面板改进: 清除 IndexedDB 对象存储时,现在会显示确认对话框,以防止不可逆的操作。
• Sources 面板优化: Logpoints 和条件断点旁边的代码行徽章现在在悬停时会显示相应的日志消息或条件工具提示。
• Performance 面板新洞察: "Layout shift culprits" 洞察现在显示未设置大小的图片链接;"LCP request discovery" 洞察现在显示最早起始点之后的图片加载延迟;修复了部分用户本地存储的过期节流设置格式;事件日志过滤速度得到提升。
• 动画面板调整: 弃用了预览截图功能,因为点击预览动画组提供了类似且更好的体验。
• 辅助功能改进 (Accessibility): Sources > DOM 断点侧边栏(如果存在)添加了 aria-labels;修复了 Console 中 Live expression 文本字段内的 Shift + Tab 键盘导航问题;Settings 现在支持 Cmd/Ctrl + +/-/0 缩放快捷键;Elements > Styles 中的 CSS 提示和警告图标以及 Angle clock 现在可以通过键盘聚焦。


author Sofia Emelianova What's new in DevTools, Chrome 139  |  Blog  |  Chrome for Developers
 
 
Back to Top