Chrome 49 Beta：CSS 自定义属性，使用 service workers 进行后台同步以及新的 ES2015 特性_html/css_WEB-ITnose

英文原文： Chrome 49 Beta: CSS custom properties, background sync with service workers, and new ES2015 features

作者：Josh Karlin，Syncing Samurai

除非另外注明，下面介绍的更新适用于最新 Chrome Beta 版（Android、Chrome OS、Linux、Mac 和 Windows）。

CSS 自定义属性

现代网站的 CSS 文件中常常含有重复的值，例如，在整个页面中重复使用一个配色方案中的少数几种颜色。更改此数据非常繁琐且容易出错，因为它分散在一个或多个 CSS 文件中。 为改善这种情况，Chrome 现在支持 CSS 自定义属性 ，允许开发者无需使用外部框架就可以在 CSS 中定义属性变量。然后，开发者可以使用 var() 函数 在文档中的任意位置 引用这些自定义属性 。

更改自定义属性可以更新网站中的多个组件

CSS 自定义属性也可以跨 shadow root 继承，因此，Web 组件可以提供“样式 API”，从而可以在不知道组件内容的情况下调整组件并设置主题。Polymer 库利用此平台功能 简化定制组件 。

使用 service workers 进行后台同步

以前，在通过网络发送更新之前，如果用户没有停留在网站上，网站可能会丢失本地修改或不同步。例如，如果用户点击“发送”并迅速离开，电子邮件网页客户端可能会丢失发送中的消息。新的 Background Sync API 通过在设备下一次连接到网络（即使并未打开该网站）时 ，由 service worker 执行 一次性同步用户的本地更改 来提升网络可靠性。

改进的 ECMAScript 2015 支持

ES2015 规范 (ES6) 是对 JavaScript 进行的重大更新，使开发者可以编写更清晰易读、更强大、更省内存的应用逻辑。 最新版本的 Chrome V8 引擎 支持 91% 的 JavaScript ES2015 功能 。现在，从数组和对象提取数据时或 设置函数参数默认值 时，开发者可以使用 解构 和 默认参数 来避免样板文件代码。 代理对象 和 Reflect API 可以定制以前隐藏的对象行为，如属性查找和分配。最新版本的 Chrome 还可以构建代码块级结构，如在 strict mode 之外可用的  class 和 let 。

Keygen 和 application/x-x509-user-cert

元素 用于生成密钥对，后者是 HTML 表单的一部分。尽管这可以用于增强用户安全性，但 和通过 MIME 类型 application/x-x509-user-cert 发送的用户证书也可能被人利用来中断用户的安全通信，干扰其设备的运行或在未经用户同意的情况下跟踪用户。今后， 将默认返回一个空字符串，并将不再自动下载和安装通过 MIME 类型 application/x-x509-user-cert 发送的用户证书。

此版本中的其他特性

• 经用户同意，网站可以通过使用新的 MediaRecorder API 录制音频和视频 ，无需依靠插件。

• 开发者现在可以使用 CSS font-display 控制字体加载方式 ，从而提升页面加载速度。

• 现在，网站可以检查哪个 service worker 客户端发起了 fetch 请求，并使用 FetchEvent.clientID 属性 返回专用响应。

• 对于不连续的滚动设备，如鼠标滚轮，Chrome 现在 以动画方式呈现滚动 ，从而可以实现 更顺畅的用户体验 。

• Chrome 现在更加严格地 保护安全的 Cookie ，并允许开发者使用 Cookie 前缀 标识安全的 Cookie。

• 现在，网站可以 使用 disableRemotePlayback 属性 （作为 Remote Playback API 一部分）防止远程播放媒体。

• Event.timeStamp 现在使用 DOMHighResTimeStamp 取代 DOMTimeStamp ，从而可以实现高精度的滚动延迟和 指针速度测量 。

• Promise 拒绝处理功能现在可以使用 UnhandledRejection 和 RejectionHandled 事件进行跟踪 。

• 现在，通过使用 URLSearchParams ，开发者可以更轻松地与 URL 的 GET 参数 交互。

• WebAudio API 现在支持 IIR Filters 、 OfflineAudioContext.suspend() 和 resume() ，以及 DecodeAudioData 中的 promise。

• WindowClient.navigate() 允许  service worker 将受控窗口定位 到新的 URL。

• 网站可以检测用户是否已请求减少数据使用，并通过选择 Save-Data 头字段 以更轻快便捷地作出响应。

细微更改

• Chrome 的 内容安全政策 现在允许“script-src http:”与 HTTP 和 HTTPS 匹配，从而防止开发者无意中拒绝安全资源。

• Fetch API 的 Request.mode 枚举现在 支持导航模式 ，从而更好地符合规范要求。

• 现在，匹配属性选择器时，开发者可以选择 忽略大小写 。

• 现在，开发者可以创建不公开的弹出窗口，页面使用 ‘rel=noopener’ 打开此窗口。

• addEventListener() 和 removeEventListener() 现在需要它们的前两个参数，同时使用字典语法指定“capture”选项，从而更好地符合规范要求和提高灵活性。

• Chromium 现在支持 TLS 中的标准版 ChaCha-Poly1305 加密套件 。

• Navigator.getStorageUpdates() 已删除，因为它不再存在于 Navigator 规范 中。

• MouseEvent.webkitMovementX/Y 已删除，代之以 无前缀版本 。

• initTouchEvent 已弃用，代之以 TouchEvent 构造函数 ，以更好地符合规范要求，并将在 Chrome 53 中一起删除。

• Object.observe() 已弃用，因为它 不再适应标准化的趋势要求 ，并将在未来的版本中删除。

• getComputedStyle(e).cssX 行为已弃用，因为它并非正式的 规范 的组成部分。

• 某些 RTCPeerConnection 旧有方法的非标准用法已弃用，以实现基于 promise 的 WebRTC 规范 实施。

• Document.defaultCharset 已弃用，以更好地符合规范要求。

Post Views: 1

除非特别声明，此文章内容采用 知识共享署名 3.0 许可，代码示例采用 Apache 2.0 许可。更多细节请查看我们的 服务条款 。