Home  >  Article  >  Web Front-end  >  Chrome 50发布,有哪些技术更新需要关注?_html/css_WEB-ITnose

Chrome 50发布,有哪些技术更新需要关注?_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-21 08:49:241277browse

Chrome 50 版本已经发布多日了,不过它带来的很多新特性值得关注,而且有些也是振奋人心的。让我们来一起看一下:

ECMAScript/JavaScript:

RegExp Unicode 标记

ES6 在正则表达式中使用 u标记来实现对 Unicode 更友好的功能和行为,比如,可以用 emoji 符号之类的。

// Match any symbol from U+1F4A9 PILE OF POO to U+1F4AB DIZZY SYMBOL.const regex = /[:hankey:-:dizzy:]/u; // Or, `/[\u{1F4A9}-\u{1F4AB}]/u`.  console.log(      regex.test(':dash:'), // false    regex.test(':hankey:'), // true    regex.test(':muscle:'), // true    regex.test(':dizzy:'), // true    regex.test(':speech_balloon:')  // false);

 更多信息,可以查看 Unicode-aware regular expressions in ECMAScript 6

更多的 well-known symbols

新增5个 ECMAScript well-known symbols

  •  Function.prototype[Symbol.hasInstance],用于 instanceof操作符.
  • RegExp.prototype[Symbol.match],用于标记一个 RegExp对象,以及 inString.prototype.match;
  • RegExp.prototype[Symbol.replace],用于 String.prototype.replace;
  • RegExp.prototype [Symbol.search],用于 String.prototype.search;
  • RegExp.prototype[Symbol.split] ,用于 String.prototype.split.

最后的4个 symbol 用作 RegExp的子类,用于改变匹配的语境,通过重写 MyRegExpSubclass.prototype[Symbol.match]等,开发者可以改变子类对应于 String.prototype.match之类的方法的行为。

其它相关

  • Object.observer()被ECMAScript 标准删掉了,所以也不再支持了。被 Proxy API 替代。

HTML5

Web Animations API 更新

新增了以下 API 以实现和其它浏览器的一致性以及提高标准的兼容性:

  • Animation.prototype.id
  • cancel事件
  • pause()方法支持状态改变
  • keyframe的名字,不能使用连字符了,正确的方法是使用驼峰命名——下个版本才实现,现在会在 console中警告

常看详细的改变,可以访问 Web Animations Improvements in Chrome 50

Presentation API更新

因为 规范的原因, PresentationConnection实例的 statechange事件不再支持,取而代之的是,实现了 message、 connect、 close和 terminate事件。

Canvas 更新

  • 元素实例现在支持 toBlob()方法,和 toDataURL()并肩了。 toBolb()比 toDataURL()更有效,因为它可以直接用编码后的二进制数据,而不用 base64 编码的字符串了。
  • 全局 createImageBitmap()方法在后台解码图片并返回 ImageBitmap, 你可以将其画在一个

更多技术细节,可以看 这里。

HTTPS

  • X25519。好抽象的称呼了,不过根据 描述,它可以让 TLS 更简单、更快、更安全,OpenSSL在去年已经支持到了。
  • 非HTTPS网站禁用 Geolocation API
  • 非HTTPS网站禁用 Application Cache API
  • 不再支持 不安全的 TLS fallback 机制。但不会不支持较老的TLS版本,建议升级到 TLS 1.2
  • 下个版本,Chrome 51 将不再支持 SPDY, 使用它的网站将转到 HTTP/1.1 ,建议使用 HTTP/2
  • 不再支持 NPN,NPN 是 TLS 为了支持 SPDY 的扩展,既然不支持 SPDY 了,这个也没必要支持了。被 ALPN 替代了。 扩展阅读: NPN 和 ALPN 的区别

其它新特性

OSX上加粗 emoji

emoji 可以用 font-weight:bold了。之前会无效。

连续聚焦导航开始点

嗯,这个翻译好拗口。 sequential focus navigation starting point 是 HTML 标准定义的, 用于当在非聚焦的区域按下 Tab或者 Shift+Tab键时,浏览器应该开始搜索可聚焦区域。 这算是无障碍的一个特性,Chrome 终于支持了。

preload

<link rel=“preload” as=“…”>  

 这个,好像很牛逼的样子哦,之前的写法,只会讲preload的请求作为xhr,而定以后,就可以以正确的格式来匹配了。

<link rel=preload as=audio href=...> //<audio>  <link rel=preload as=video href=...> //<video>  <link rel=preload as=script href=...> //<script>, Worker's importScripts  <link rel=preload as=style href=...> //<link rel=stylesheet>, CSS @import  <link rel=preload as=font href=...> //CSS @font-face  <link rel=preload as=image href=...> //<img  alt="Chrome 50发布,有哪些技术更新需要关注?_html/css_WEB-ITnose" >, <picture>, srcset, imageset  <link rel=preload as=image href=...> //SVG's <image>, CSS *-image  <link rel=preload href=...> //XHR, fetch  <link rel=preload as=worker href=...> //Worker, SharedWorker  <link rel=preload as=embed href=...> //<embed>  <link rel=preload as=object href=...> //<object>  <link rel=preload as=document href=...> //<iframe>, <frame>  

 同时,不再支持

当然还有其它的一些细碎的改进,这里不多提了。感兴趣的同学可以去阅读 Chrome 的 changelog

整理自: https://dev.opera.com/blog/opera-37/

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn