💫 Chrome 130 版本已正式发布，DevTools 也带来众多特性更新，主要包括：🎉
📝 Network 面板：重新定义网络过滤器 🖱️ Elements 面板：带有标志的滚动溢出 📈 Performance 面板：浏览面包屑导航 ⛏️ Memory 面板：改进了纯 JS 对象的命名
Network 面板：重新定义网络过滤器
在 Chrome DevTools 130 版本中，为了简化界面，将与隐藏、屏蔽和第三方相关的复选框移到了下拉列表下方。该列表包含一个数字，表示下拉菜单下已选中的过滤条件数量。
Elements 面板：带有标志的滚动溢出
元素面板现在会使用新的“滚动”标记，标记包含溢出内容且具有 overflow: scroll 或 overflow: auto 的元素，以便您轻松发现滚动溢出。与其他标志一样，此标志可反映当前 DOM，并且如果内容因大小变化等原因而停止溢出，此标志就会消失。
Performance 面板：浏览面包屑导航
现在，您可以在效果录制的时间轴中浏览面包屑导航：在面包屑导航之间来回“跳转”，覆盖子面包屑导航，以及移除多个子导航。以前，当您选择父级面包屑导航时，其子级会消失。
Memory 面板：改进了纯 JS 对象的命名
为了整理和清理堆快照中的 Object 类别，现在的普通 JavaScript 对象如下所示：
根据它们包含的属性命名，例如 {firstProperty, secondProperty, ..., *nthProperty}。可通过开发者工具构造的这些名称进行搜索。如果它们具有相同的属性，则将其归为一组。
更多参考：https://developer.chrome.com/blog/new-in-devtools-130
1.关注FED实验室(前端开发实验室)获取更多前端热点资讯、技术实践、面试招聘等精彩内容。
2.扫描下面二维码，加小懒好友，进全栈开发交流群，一起学习和进步。
大家都在看
