此页面由 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 将路由引入网络平台！

使用 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 峰会 YouTube 频道观看。

用户代理减少源试用

用户代理缩减是通过将用户代理字符串中的信息仅缩减为浏览器的品牌和重要版本、其桌面版和移动版的区别以及所运行的平台，来减少被动指纹界面。

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

这些更改将逐步应用于多个版本，但您所需的一切准备工作和测试现在都已就绪。

如需了解所有详细信息和时间表，请参阅 developer.chrome.com 上的用户代理缩减源试用博文。

还有更多其他奖励！

当然还有很多。

如果您一直遵循 Storage Foundation API 的工作，我们还提供了访问句柄的新源试用功能。
WebAssembly 现在提供异常处理支持，可允许代码在抛出异常时破坏控制流。
Chrome 100 将于明年面世。这意味着，是时候确保您的代码可以处理超过两位数了！

深入阅读

这仅涵盖了部分重要的亮点。如需了解 Chrome 95 中的其他变化，请点击以下链接。

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

我是 Pete LePage