【第3444期】Chrome 131 开发者工具的新变化

主要观点总结

Chrome DevTools在版本131中引入了新的AI辅助功能Gemini，用于调试CSS。文章介绍了Gemini的功能，以及其他对性能面板、控制台洞察、非合成的动画等多项增强功能，还包括对非HTTP页面的Lighthouse审核和无障碍性改进等。文章由Sofia Emelianova分享，飘飘翻译。

关键观点总结

关键观点1: 新的AI辅助功能Gemini

Chrome DevTools引入了一个新的实验性AI辅助面板Gemini，用户可以与之聊天并获得CSS调试帮助。该功能位于“元素”面板中，并可以通过右键点击元素选择“询问AI”来启动。

关键观点2: 性能面板改进

性能面板新增了注释选项卡、可操作的洞察以及更直观的展示Reactive Objects等功能。用户可以直接在跟踪记录上标注事件、突出显示时间范围，并获取性能洞察。

关键观点3: 非合成的动画调试增强

动画轨道现在可以显示非复合动画的有用信息，包括以红色三角形标记未合成的动画，并在“摘要”选项卡中展示合成失败的原因。

关键观点4: 对非HTTP页面的Lighthouse审核改进

Lighthouse现在可以在时间段和快照模式下为非HTTP页面生成报告。

关键观点5: 其他改进

包括硬件并发设置移动到传感器面板、控制台中的堆栈跟踪改进、元素>样式支持网格覆盖和CSS全局关键字对sideways-*写作模式的支持等。