此页面由 Cloud Translation API 翻译。

Chrome 95 的新变化

Pete LePage

以下是您需要知晓的相关信息：

借助内置于浏览器中的 URLPattern，路由变得更加简单。
Eye Dropper API 提供了用于选择颜色的内置工具。
我们推出了新的来源试用计划，您现在可以选择接收经过缩减的 UA 字符串。
PWA 峰会视频已全部上线。
还有许多其他功能。

我是 Pete LePage，目前在家办公和录制视频。我们来深入了解一下 Chrome 95 中面向开发者的新功能。

使用 `URLPattern` 进行路由

几乎所有 Web 应用都以某种方式依赖于路由，无论是将路径映射到磁盘上文件的服务器上运行的代码，还是在网址发生变化时更新 DOM 的单页应用中的逻辑。URLPattern 是一个新的 Web 平台 API，用于标准化路由模式语法。

它基于现有框架构建，可让您更轻松地执行常见的路由任务。例如，与完整网址或网址路径进行匹配，然后返回有关令牌和组匹配的信息。

如果您已经熟悉 Express、Ruby on Rails 或 path-to-regexp 中使用的路由语法，那么这可能看起来很熟悉。

如需使用它，请创建一个新的 URLPattern()，并提供要与模式匹配的详细信息。模式可以包含通配符、命名标记组、正则表达式组和组修饰符。

const p = new URLPattern({
  protocol: 'https',
  hostname: 'example.com',
  pathname: '/:folder/*/:fileName.jpg',
  search: '*',
  hash: '*',
});

例如，我们来看看 Google 文档可能会使用的 URLPattern。我们将指定文件的 kind、文件 ID 以及打开该文件时使用的 mode。然后，如需使用该模式，我们可以调用 test() 或 exec()。

const url = 'https://docs.google.com/document/d/1s...5c/edit#heading=h.8...c';

const pattern = new URLPattern({
  pathname: '/:kind/d/:fileID/:mode',
  hash: '*',
});

const r = pattern.exec(url);
// {
//   "pathname": {"groups": {
//     "fileID": "1s...5c",
//     "kind": "document",
//     "mode": "edit"
//   }, ...},
//   "hash": {"groups": {"0":"heading=h.8...c"}, ...},
//   ...
// }

Chrome 和 Edge 95 及更高版本中默认启用 URLPattern。对于尚不支持该功能的浏览器或环境（例如 Node），您可以使用 urlpattern-polyfill 库。

如需了解完整详情，请参阅 Jeff 的文章网址Pattern 为 Web 平台引入了路由！

使用 Eye Dropper API 选择颜色

我用过的几乎所有设计应用都带有滴管工具，可让您轻松确定某个对象的颜色。某些浏览器在 <input type=color> 中内置了滴管功能，但效果并不理想。

由 Microsoft 的部分人员实现的滴管 API 将此功能引入了 Web 领域。如需使用它，请创建一个新的 EyeDropper() 实例，然后对其调用 open()。

const eyeDropper = new EyeDropper();
const result = await eyeDropper.open();
// result = {sRGBHex: '#160731'}

与许多其他现代 Web API 一样，它以异步方式运行，因此不会阻塞主线程。当用户点击所需的颜色时，系统会解析为用户点击的颜色。

您可以试用快速演示，并在 Glitch 上查看代码。

PWA 峰会

您是否参加了本月早些时候举办的 PWA 峰会？

很高兴看到有这么多开发者讨论 PWA 并分享他们的经验。如果您错过了大会，请访问 PWASummit.org 或 PWA Summit YouTube 频道，观看所有视频。

用户代理缩减源试用

用户代理缩减旨在减少被动式数字“指纹”收集途径，方法是将 User-Agent 字符串中的信息仅缩减为浏览器的品牌和主要版本、桌面版或移动版以及其所运行的平台。

从 Chrome 95 开始，我们推出了新的源试用，您现在可以选择接收经过缩减的 UA 字符串。这样，您就可以在缩减后的 UA 成为 Chrome 中的默认行为之前发现和解决问题。

这些更改将在多个版本中逐步应用，但您现在就可以准备和测试所需的一切。

如需了解所有详细信息和时间安排，请参阅 developer.chrome.com 上的用户代理缩短来源测试一文。

等等！

当然，还有许多其他功能。

如果您一直在关注 Storage Foundation API 的工作，请注意，我们推出了新的访问权限标识符源代码试用版。
WebAssembly 现在提供异常处理支持，让代码可在抛出异常后打破控制流。
Chrome 100 将于明年发布。这意味着，您需要确保自己的代码可以处理超过 2 位数的值！

深入阅读

本文仅介绍了一些主要亮点。如需了解 Chrome 95 中的其他变更，请点击以下链接。

如需及时了解最新动态，请订阅 Chrome 开发者 YouTube 频道，这样每当我们发布新视频时，您就会收到电子邮件通知。

我是 Pete LePage，Chrome 96 发布后，我会立即为您介绍 Chrome 中的新变化！