Chrome 148 的 DevTools 这次主要升级了 4 个方向:
无障碍调试更完整
预加载和崩溃排查更方便
网络请求分析更直观
对 AI 代理开发支持更多
主要更新
完整无障碍树 现在默认开启,旧版面包屑式视图被移除,切换入口改到侧边栏里。
Speculative loads 预加载调试增强了,可以按文本筛选、直接看失败请求状态码,还能看到是不是表单提交触发的。
Crash reports 崩溃报告新增上下文信息,方便定位崩溃发生时的页面状态。
@container 现在支持仅名称写法,Styles 面板显示也更准确。
Styles 面板会自动折叠没有实际生效样式的区块,界面更干净。
Network 面板新增 Request # 列,可以看到请求发起顺序,还会根据真实用户数据推荐限速方案。
广告标记 现在会告诉你为什么某个元素被识别成广告,比如命中了哪个过滤规则、由哪些脚本生成。
图片说明

展示新的无障碍树切换入口,说明完整无障碍树已经成为默认视图。

展示新的 Speculation rules 过滤栏,以及 Crash report 的上下文信息区域。

展示新的 Request # 请求顺序列,以及推荐的网络限速配置。
一句话总结
这次更新的重点,就是让 DevTools 更容易排查“为什么出问题”,尤其是在无障碍、预加载、崩溃和网络请求分析这几块。
