了解 2023 年 5 月在稳定版和 Beta 版网络浏览器中推出的一些有趣的功能。
浏览器稳定版
2023 年 5 月，Firefox 113、Chrome 113、Chrome 114 和 Safari 16.5 成为稳定版。我们来看看这对网络平台意味着什么。
WebGPU
Chrome 113 包含 WebGPU，是适用于 Web 的 WebGL 和 WebGL 2 图形 API 的继任者。它提供各种现代功能，例如 GPU 计算、更低的 GPU 硬件开销访问、通过单个图形设备渲染到多个画布的功能，以及更好、更可预测的性能。
First-Party Set
First-Party Set (FPS) 是 Privacy Sandbox 的一部分。它是组织声明网站之间的关系的一种方式，这样浏览器就可以决定何时允许对某个集合中的网站进行受限的第三方 Cookie 访问。FPS 开始在 Chrome 113 中分阶段发布。
CSS 媒体功能等
对于 CSS，Chrome 113 包含 overflow-inline 和 overflow-block 媒体功能。
以及 update 媒体功能。
此外，还包含 linear() 加/减速函数，如需了解详情，请参阅使用 linear() 加/减速函数在 CSS 中创建复杂的动画曲线一文。
浏览器支持
- 113
- 113
- 112
- 17.2
CSS Color Level 4 功能
Firefox 113 包含 color()、lab()、lch()、oklab()、oklch() 和 color-mix() 函数表示法，以及 forced-color-adjust 属性。这意味着，现在三大引擎都支持新的颜色空间和函数。您可在高清 CSS 颜色指南中详细了解这些颜色空间和函数。
进一步控制 :nth-child() 所选项
Firefox 113 还添加了将选择器列表传递到 :nth-child() 和 nth-last-child() 的功能。如需了解详情，并查看示例，请参阅使用 S 语法更好地控制 :nth-child() 选择一文。
浏览器支持
- 111
- 111
- 113
- 9
压缩流 API
由于 Firefox 113 中包含了 Compressions Streams API，现在所有三大引擎都支持该 API，它支持对信息流进行压缩和解压缩。这意味着 JavaScript 应用不再需要捆绑压缩库。
CSS 嵌套
Safari 16.5 大多解决了问题，但还增加了对 CSS 嵌套的支持，新的嵌套选择器 > 用于嵌套相关的样式规则，使用预处理器的开发者熟悉的方式：
.nesting {
color: hotpink;
> .is {
color: rebeccapurple;
> .awesome {
color: deeppink;
}
}
}
利用text-wrap: balance平衡标题
从 Chrome 114 开始，您可以使用 text-wrap: balance。这样，您可以平衡标题，避免最后一行只出现一个字词的问题，从而提供更令人愉悦且易读的结果。如需了解详情，请参阅 CSS text-wrap: balance。
CHIPS：具有独立分区状态的 Cookie
作为逐步停用第三方 Cookie 的工作之一，CHIPS 支持使用新的 Cookie 属性 Partitioned 来选择启用由顶级网站划分的第三方 Cookie。Chrome 114 支持 CHIPS。
Popover API
此外，Chrome 114 中还新增了 Popover API，以便您更轻松地构建在所有其他 Web 应用界面之上显示的瞬时界面元素。
其中包括操作菜单、表单元素建议、内容选择器和教学界面等用户互动元素。
新的 Popover 属性可让任何元素自动显示在顶层中。这意味着开发者无需再担心定位、元素堆叠、焦点或键盘互动问题。
如需了解详情，请参阅 Popover API 简介。
Beta 版浏览器版本
通过 Beta 版浏览器，您可以预览浏览器下一个稳定版本的新功能。不妨趁此时机测试一下新功能或内容移除，这些新功能或内容可能会在全球发布之前对您的网站产生影响。新的 Beta 版产品包括 Firefox 114、Chrome 115 和 Safari 16.6。这些版本为平台带来了许多很棒的功能。如需了解所有详细信息，请查看版本说明，以下是一些亮点。
Chrome 115 为 CSS display 属性添加了多个值。这意味着，display: flex 将变为 display: block flex，display: block 将变为 display: block flow。单个值会作为旧版关键字进行维护，而在 Chrome 稳定版中，这样会使多个值在所有引擎中可用。
在 Chrome 115 中，还有针对网页动画规范的 ScrollTimeline 和 ViewTimeline 扩展。这些库通过 CSS 和 JavaScript 实现滚动驱动的动画。
Firefox 114 包含 WebTransport API，这是对 WebSocket 的一项现代更新，支持多流、单向流和无序传送。
“网络新体验”系列视频的一部分