Chrome 134 版本开发者工具(DevTools)更新内容

Chrome 134 版本开发者工具(DevTools)更新内容

一、隐私与安全面板

旧的 Security 面板已演变为隐私与安全面板,并新增了一个专注于隐私的部分。在该部分中,可以:

  • 在 DevTools 打开时,临时限制第三方 Cookie(可带或不带例外),并测试网站在此情况下的表现。
  • 查看一张表格,其中包含有关第三方 Cookie 的信息,包括它们是否被临时限制模式拦截或豁免,以及可能受影响的 Cookie 类型。

二、Performance 面板改进

此版本为 Performance 面板带来了一系列改进。

1. 校准后的 CPU 限流预设

支持自动校准,并获得两个额外的 CPU 限流预设,这些预设能更准确地模拟低端和中端移动设备。

在 Performance > CPU throttling 下拉菜单中,选择 Calibrate…;然后在 Settings 中点击 Calibrate, Continue,等待 DevTools 为设备计算降速率。校准后的限流选项将出现在 Performance > CPU throttling 下拉菜单中。

2. 在同一个 AI 聊天中选择不同的性能事件

AI 助手面板允许在同一个聊天中切换性能跟踪中选定的事件。换句话说,无需开启新的聊天即可讨论不同的事件。

3. Performance 中的第一方和第三方高亮

Performance 面板在 Summary 选项卡新增了一张表格,能够区分第一方、第三方以及扩展数据。

将鼠标悬停在表格中的条目上,可以在性能跟踪中看到相应的事件被高亮显示。选中 “Dim 3rd parties” 以仅聚焦第一方数据。

此外,点击表格中高亮条目旁的 account_tree 图标,即可切换到以第三方分组显示的 Bottom-up 选项卡。

4. 标记工具提示和洞察中的字段数据

如果已启用字段数据,可以在指标标记工具提示和 Insights 选项卡中查看到它。

5. “Forced reflow” 洞察

Performance > Insights 选项卡新增了一项洞察:Forced reflow。Forced reflow 发生在渲染引擎暂停脚本执行以计算样式和布局时。Forced reflow 可能成为避免的瓶颈。

当将鼠标悬停在这项新洞察上时,它会高亮显示触发 Forced reflow 的顶级函数调用、其堆栈跟踪,并显示总的 reflow 时间。

6. “Optimize DOM size” 洞察

另一项新洞察是 Optimize DOM size。庞大的 DOM 树可能会降低页面性能。

该洞察在性能跟踪中高亮显示了因 DOM 尺寸过大而导致的长时间布局重排和样式重计算,并提供了关于元素总数、层级深度以及子元素最多的统计数据。

7. 使用 console.timeStamp 扩展性能跟踪

扩展性 API 支持 console.timeStamp。除了 performance.measure 和 performance.mark 之外,还可以使用 console.timeStamp 来在性能跟踪中创建自定义轨道并捕获自定义标记。这是一种更轻量的替代方式,不会向浏览器内部的性能时间线添加条目,而只会在性能跟踪中显示它们。

例如,可以使用如下语法:

console.timeStamp("Start");
// Some time later ...
console.timeStamp("End");
// Some time later ...
console.timeStamp("Measure 1", "Start", "End", "Track 1");
// Some time later ...
console.timeStamp("Measure 2", "Start", undefined, "Track 1");

在 Capture settings > Show custom tracks 选项中勾选后,将在跟踪记录中看到自定义轨道。

三、Elements 面板改进

本版本为 Elements 面板带来了一系列改进。

1. 动画样式的实时数值

Elements > Styles 选项卡会实时更新动画样式的数值。

2. 支持 :open 伪类及各种伪元素

Elements 面板在 Styles > :hov > Force specific element state 部分支持某些 HTML 元素(如 details、select、dialog 和 input)的 :open 伪类。

此外,Elements 面板还支持几个新的伪元素:::checkmark、::picker-icon 以及与轮播相关的 ::column、::scroll-button、::scroll-marker 和 ::scroll-marker-group。

四、复制所有控制台消息

可以通过右键一次性复制所有控制台消息。

另外,在 Network > Request Payload 的上下文菜单中也提供了类似的复制选项。

五、内存(Memory)面板中的字节单位

内存面板会以合适的字节单位显示大小,而不再仅仅显示大量的字节数字。

六、其他

  • Performance:
    • Annotations: 可以点击标签来选择对应的条目
    • Insights: 在 Insights 选项卡中,点击 CLS 会选择最差的聚类,而非最差的偏移
  • Ignore list: 默认情况下,所有以 “node:” 开头的 Node 内部项现已被忽略
  • Live expressions: 修复了一个导致 live expression 影响 $_ 命令的 bug
  • **Elements > Styles:**相对长度带有一个弹出窗口,显示其绝对值
  • **Accessibility:**列标题会提示是否可排序
  • 标签图标显示在标签名称右侧,而非左侧

Chrome 134

  • Privacy and security panel
  • Performance improvements
  • Calibrated CPU throttling presets
  • Select different performance events in the same AI chat
  • First- and third-party highlighting in Performance
  • Field data in marker tooltips and insights
  • Forced reflow insight
  • ‘Optimize DOM size’ insight
  • Extend the performance trace with console.timeStamp
  • Elements panel improvements
  • Real-time values of animated styles
  • Support for :open pseudo-class and various pseudo-elements
  • Copy all console messages
  • Byte units in the Memory panel
  • Miscellaneous highlights

引用

  • What’s new in DevTools

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/40149.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

顺序表和链表

目录 线性表顺序表概念与结构分类静态顺序表动态顺序表 动态顺序表的实现SeqList.hSeqLIst.c 和 test.c初始化SLInit增容SLCheckCapacity尾插SLPushBack打印SLPrint头插SLPushFront尾删SLPopBack头删SLPopFront查找SLFind任意插SLInsert任意删SLErase销毁顺序表SLDestroy 顺序表…

性能测试、负载测试、压力测试的全面解析

在软件测试领域,性能测试、负载测试和压力测试是评估系统稳定性和可靠性的关键手段。​它们各自关注不同的测试目标和应用场景,理解这些差异对于制定有效的测试策略至关重要。 本文对性能测试、负载测试和压力测试进行深入分析,探讨其定义、…

FPGA_YOLO(二)

上述对cnn卷积神经网络进行介绍,接下来对YOLO进行总结,并研究下怎么在FPGA怎么实现的方案。 对于一个7*7*30的输出 拥有49个cell 每一个cell都有两个bbox两个框,并且两个框所包含的信息拥有30个 4个坐标信息和一个置信度5个,剩下就是20个类别。 FPGA关于YOLO的部署 1…

Windows系统安装Node.js和npm教程【成功】

0.引言——Node.js和npm介绍 项目描述Node.js基于Chrome V8引擎的JavaScript运行环境,使JavaScript可用于服务器端开发。采用单线程、非阻塞I/O及事件驱动架构,适用于构建Web服务器、实时应用和命令行工具等npmNode.js的包管理器与大型软件注册表。拥有…

使用外部事件检测接入 CDH 大数据管理平台告警

CDH 大数据管理平台 CDH(Cloudera Distribution Hadoop)是一个企业级的大数据平台,由 Cloudera 公司提供,它包含了 Apache Hadoop 生态系统中的多种开源组件,并对其进行了优化和集成,以支持大规模数据存储…

Node.js的安装和环境配置

漂亮女同事想了解Node.js的安装和环境配置。首先,我说需要回忆一下自己安装Node.js的经历,确保步骤是正确的。可能用户是刚接触开发的新手,所以需要详细但清晰的指导。 首先,应该介绍Node.js是什么,不过用户可能已经知…

在普通用户下修改root用户密码

1 从普通用户切换到root用户 sudo -s 再输入密码。 2 输入passwd ,会提醒你输入当前用户密码,验证后会提醒你输入root用户密码。 3 切换到root用户,使用修改过的密码登陆。 4 成功进入root用户。

【#2】介绍第三方库

一、JsonCpp 库 🔥 JSONCPP 是一个开源的 C 库,用于解析和生成 JSON(JavaScript Object Notation)数据。它提供了简单易用的接口,支持 JSON 的序列化和反序列化操作,适用于处理配置文件、网络通信数据等场…

Qt开发:QInputDialog的使用

文章目录 一、QInputDialog的介绍二、 QInputDialog的基本用法三、使用 QInputDialog的实例四、QInputDialog的信号与槽 一、QInputDialog的介绍 QInputDialog 是 Qt 提供的一个对话框类,用于获取用户输入的文本、整数或浮点数。它提供了简单易用的静态方法和可定制…

SCI一区 | Matlab实现DBO-TCN-LSTM-Attention多变量时间序列预测

SCI一区 | Matlab实现DBO-TCN-LSTM-Attention多变量时间序列预测 目录 SCI一区 | Matlab实现DBO-TCN-LSTM-Attention多变量时间序列预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 1.【SCI一区级】Matlab实现DBO-TCN-LSTM-Attention多变量时间序列预测(程…

Vulnhub-Thales通关攻略

第0步:网卡配置 靶机端:将下载好的靶机环境,导入 VritualBox,设置为 Host-Only 模式 Kali端:将 VMware 中桥接模式网卡设置为 VritualBox 的 Host-only 第一步:确定靶机IP #靶机IP 192.168.56.101#KaliIP 1…

JVM 02

今天是2025/03/23 19:07 day 10 总路线请移步主页Java大纲相关文章 今天进行JVM 3,4 个模块的归纳 首先是JVM的相关内容概括的思维导图 3. 类加载机制 加载过程 加载(Loading) 通过类全限定名获取类的二进制字节流(如从JAR包、网络、动态…

Python学习笔记(7)关于列表创建,增加,删除

列表 **Python中一切都是对象 存放多个值的连续内存空间 大小可变 增加元素 a a[50]#➕运算符操作,产生了新对象 list.append(x) #将元素x增加至list尾部 list.extend(alist) #将列表alist增加至list尾部 list.insert(index.x) #将元素x插入list指定index位置 …

【图片识别Excel表格】批量将图片上的区域文字识别后保存为表格,基于WPF和阿里云的项目实战总结

一、项目背景 在信息处理和文档管理中,经常会遇到需要从大量图片中提取文字并进行整理的场景。例如,财务部门需要从大量报销票据中提取金额、日期等信息;法务部门需要从合同文档中提取关键条款;教育行业需要从试卷中提取学生的答题内容等。传统的手工处理方式不仅耗时长、…

【C语言】文件操作(详解)

个人主页 今天我们来讲一下有关文件的相关操作,希望看完这篇文章对你有所帮助,大力感谢你对博主的支持! 文章目录 ⭐一、为什么使用文件🎉二、什么是文件2.1 程序文件2.2 数据文件2.3 文件名 🎡三、二进制文件和文本…

数据库中不存在该字段

mybatisplus 定义的类中某些字段是数据库里面没有的,我们可用tablefield(existfalse)来注解,演示如下:

计算机组成原理———I\O系统精讲<1>

本篇文章主要介绍输入输出系统的发展概况 一.输入输出系统的发展概况 1.早期阶段 该阶段的特点是I/O设备与主存交换信息都必须通过CPU 当时的I/O设备有如下几个特点: (1)每个I\O设备都必须配有一套独立的逻辑电路与CPU相连,用来…

Linux操作系统7- 线程同步与互斥7(RingQueue环形队列生产者消费者模型改进)

上篇文章:Linux操作系统7- 线程同步与互斥6(POSIX信号量与环形队列生产者消费者模型)-CSDN博客 本篇代码仓库:myLerningCode/l36 橘子真甜/Linux操作系统与网络编程学习 - 码云 - 开源中国 (gitee.com) 目录 一. 单生产单消费单保…

全面讲解python的uiautomation包

在常规的模拟鼠标和键盘操作,我们一般使用pyautogui,uiautomation模块不仅能直接支持这些操作,还能通过控件定位方式直接定位到目标控件的位置,而不需要自己去获取对应坐标位置。uiautomation模块不仅支持任意坐标位置截图&#x…

图解CNN、RNN、LSTM

一、CNN 二、RNN 三、LSTM 以上笔记参考自b站up主 自然卷小蛮(自然卷小蛮的个人空间-自然卷小蛮个人主页-哔哩哔哩视频),感兴趣的可以去深入了解。