Chrome 74 中的新功能

Pete LePage

在 Chrome 74 中，我们添加了对以下内容的支持：

还有许多其他功能！

我是 Pete LePage。下面我们就来看看 Chrome 74 有哪些面向开发者的新功能！

更新日志

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

私有类字段

类字段可简化类语法，无需构造函数函数即可仅定义实例属性。在 Chrome 72 中，我们添加了对公共类字段的支持。

class IncreasingCounter {
  // Public class field
  _publicValue = 0;
  get value() {
    return this._publicValue;
  }
  increment() {
    this._publicValue++;
  }
}

我说过，私人课程字段正在筹备中。很高兴告诉大家 Chrome 74 中已推出私有类字段新的私有字段语法与公共字段类似，只不过您需要使用 #（井号）将字段标记为私有。将 # 视为字段名称的一部分。

class IncreasingCounter {
  // Private class field
  #privateValue = 0;
  get value() {
    return this.#privateValue;
  }
  increment() {
    this.#privateValue++;
  }
}

请注意，private 字段就是私有字段。它们可以在类内部访问，但无法在类正文之外访问。

class SimpleClass {
  _iAmPublic = 'shared';
  #iAmPrivate = 'secret';
  doSomething() {
    ...
  }
}

如需详细了解公共类和私有类，请参阅 Mathias 关于类字段的文章。

prefers-reduced-motion

部分用户报告在观看视差滚动、缩放和其他动画效果时会感到头晕。为解决此问题，许多操作系统都提供了一个选项，可尽可能减少动作。

Chrome 现在提供了一个媒体查询 prefers-reduced-motion（媒体查询级别 5 规范的一部分），可让您检测此选项是否处于启用状态。


@media (prefers-reduced-motion: reduce)

假设我有一个注册按钮，它会通过轻微的动作吸引用户的注意力。借助新查询，我可以仅为按钮关闭动作感应。

button {
  animation: vibrate 0.3s linear infinite both;
}

@media (prefers-reduced-motion: reduce) {
  button {
    animation: none;
  }
}

请参阅 Tom 撰写的文章 Move Ya! 或者，如果用户选择了“减少动画”，则不执行此操作！了解详情。

CSS transition 事件

CSS 转换规范要求在转换加入队列、开始、结束或取消时发送转换事件。其他浏览器支持这些事件已有一段时间...

但直到现在，Chrome 都不支持这些功能。在 Chrome 74 中，您现在可以监听：

  • transitionrun
  • transitionstart
  • transitionend
  • transitioncancel

通过监听这些事件，您可以跟踪或更改运行转场效果时的行为。

Feature Policy API 更新

借助功能政策，您可以有选择地启用、停用和修改 API 和其他 Web 功能的行为。这可以通过 Feature-Policy 标头或 iframe 上的 allow 属性来实现。

Feature-Policy: geolocation 'self'

<iframe ... allow="geolocation self">
</iframe>

Chrome 74 引入了一组新的 API，用于检查已启用的功能：

  • 您可以通过 document.featurePolicy.allowedFeatures() 获取允许的功能列表。
  • 您可以使用 document.featurePolicy.allowsFeature(...) 检查是否允许使用特定功能。
  • 此外，您可以通过 document.featurePolicy.getAllowlistForFeature() 获取当前页面上使用的允许指定功能的一系列网域。

如需了解详情，请参阅“功能政策简介”博文。

等等！

当然，这只是 Chrome 74 中面向开发者的部分变更，还有许多其他变更。我个人对 KV Storage 感到非常兴奋，它是一种超快速的异步键值对存储服务，可作为源试用服务提供。

Google I/O 大会即将开幕！

别忘了，Google I/O 大会（5 月 7 日至 9 日）即将开幕，届时我们将为您带来许多精彩的新内容。如果您无法参会，我们会对所有会议进行直播，并在之后将其发布到 Chrome Developers YouTube 频道。

订阅

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

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