Chrome 135 版本开发者工具（DevTools）更新内容
Chrome 135 版本开发者工具（DevTools）更新内容一、性能（Performance）面板改进
1. 性能面板中的设置文件和函数调用现已表现泉源和脚本链接
Performance > Summary（性能 > 概览）选项卡现在会表现设置分析（profile）和函数调用相干的脚本及泉源链接，如许就不须要再将鼠标悬停在 Main 轨道上的变乱上来检察这些信息了。
表现在 Summary 面板中添加泉源和脚本链接前后的对比。
别的，当将鼠标悬停在 Network（网络）或 Main（主线程）轨道上的变乱时，工具提示中现在还会表现第三方名称。
https://i-blog.csdnimg.cn/img_convert/d2679656dfc8b2c1aa63edfeaa761060.png
2. 支持按阶段分别的 LCP字段数据
启用字段数据后，Performance > Insights > LCP by phase（按阶段分别的最大内容绘制）洞察项现在会在额外的表格中表现来自 Chrome 用户体验陈诉的第 75 百分位图像加载时间，可以直接在该洞察中对比各阶段的加载时间。
https://i-blog.csdnimg.cn/img_convert/97e1357f829620c35dfe19e1d7525708.png
3. 网络依赖树洞察项
Performance > Insights（性能 > 洞察）标签页新增了一个名为 Network dependency tree（网络依赖树）的洞察项。该洞察可以知道是否存在串联的关键哀求，而这通常是不保举的。可以将鼠标悬停在洞察项中列出的哀求上，它们会在 Network（网络）轨道中被高亮表现。
https://i-blog.csdnimg.cn/img_convert/fe99dd865ebca55fe43f433afa3e2dc6.gif
4. 最重调用栈高亮表现
Performance 面板现在支持将鼠标悬停在 Call tree（调用树）或 Bottom-up > Heaviest stack（自底向上 > 最重调用栈）侧边栏中的项时，在 Main 轨道中高亮表现对应内容，并自动淡化其他内容。如允许以更直观地找到调用栈中耗时最多的嵌套项。
https://i-blog.csdnimg.cn/img_convert/2e2f57fa38bb1df3e9a551bd8b87a76d.gif
二、Elements 面板中的辅助功能树视图
现在，Elements（元素）面板默认启用了全页辅助功能（Accessibility）树视图。
之前只能在 Elements > Accessibility 标签页中欣赏一个独立的辅助功能树。现在，可以点击 DOM 树右上角的 “辅助功能树视图切换” 按钮（图标为 accessibility_new），在 DOM 树与全页辅助功能树之间自由切换，方便同时检察两者及其对应关系。
启用默认的辅助功能树视图前后的界面差别也被展示了出来。
辅助功能树允许查抄辅助技能（如屏幕阅读器）怎样感知页面内容，并表现每个 DOM 节点的 ARIA 属性及其盘算后的辅助功能属性。
https://i-blog.csdnimg.cn/img_convert/763e1a5cce1c4422f19db5b59a5c6de9.png
三、多个面板的空状态优化
针对多个面板、地域和标签页在“空状态”（即无内容表现）下的界面举行了优化，可以或许更清楚地知道接下来该做什么来开始使用它们。
比方，Network（网络）面板中的空状态现在新增了实用按钮，如“重新加载页面”（Reload page），快速触发网络运动，开始调试。
https://i-blog.csdnimg.cn/img_convert/a854a890df6744ac942e39cc31cbf86c.png
四、Ask AI 选项移至菜单底部
Ask AI（扣问 AI）选项现在已从下拉菜单的顶部移到了菜单的底部，更符适用户的利用风俗和界面布局逻辑。
https://i-blog.csdnimg.cn/img_convert/9f844464229bdbcda0f73ae3b1ac8e8a.png
五、Lighthouse 升级至 12.4.0
Lighthouse 面板现已升级为 Lighthouse 12.4.0 版本。
在此版本中，一些性能审计项在通过条件下会被标记为“信息性（informative）”，而不再潜伏在“已通过的审计”列表中，更全面地相识页面体现。
六、其他
[*]性能 > Summary：将原来的“两行 Total time 与 Self time”归并为“一行 Duration”，如有自耗时则会以括号情势表现（比方 Duration (self: 12ms)），简化展示信息
[*]Issues 面板：新增两种题目范例支持：
[*]<select> 元素在辅助功能树中的相干题目；
[*]网络服务中分析或校验时发生的 SRI 消息署名错误
[*]辅助功能（Accessibility）：使用键盘导航在 Elements > Styles 中徐徐检察元素时，当前元素现在会有可视化描边提示
[*]Elements 面板：与 <select> 元素相干的题目现在会被高亮标出，表现为波浪下划线
[*]Network 面板：覆盖提示点（override dot）和 Cookie 告诫图标的位置从标签左侧移到了右侧，使界面更整洁
Chrome 135
[*]Performance panel improvements
[*]Origin and script links for profile and function calls in Performance
[*]LCP by phase field data support
[*]Network dependency tree insight
[*]Duration instead of total and self time in Summary
[*]Heaviest stack highlighting
[*]Improved empty states for various panels
[*]Accessibility tree view in Elements
[*]Lighthouse 12.4.0
[*]Miscellaneous highlights
引用
[*]What’s new in DevTools
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。
页:
[1]