async
和await
允许您像编写同步代码一样编写基于 promise 的代码,同时又不会阻塞主线程。- 指针事件提供了一种统一的方式来处理所有输入事件。
- 添加到主屏幕的网站会自动获得永久性存储空间权限。
还有许多其他功能。
我是 Pete LePage。以下是 Chrome 55 中面向开发者的新功能!
指针事件
曾经,指向网络上的事物很简单。您有一个鼠标,它四处移动,有时会按下按钮,仅此而已。但在这方面的表现并不稳定
触摸事件是很好的做法,但为了支持触摸和鼠标,您必须支持两种事件模型:
elem.addEventListener('mousemove', mouseMoveEvent);
elem.addEventListener('touchmove', touchMoveEvent);
Chrome 现在通过分派 PointerEvents 实现统一的输入处理:
elem.addEventListener('pointermove', pointerMoveEvent);
指针事件统一了浏览器的指针输入模型,将轻触、触控笔和鼠标集中到一组事件中。IE11、Edge、Chrome 和 Opera 支持加载动画,在 Firefox 中部分支持。
如需了解详情,请参阅指明未来的方向。
async
和await
异步 JavaScript 可能难以推断。使用此函数及其所有“可爱”回调:
function logFetch(url) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function (e) {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
console.log(xhr.responseText);
} else {
console.error('xhr failed', xhr.statusText);
}
}
};
xhr.onerror = function (e) {
console.error(xhr.statusText);
};
xhr.open('GET', url);
xhr.send();
}
使用 promises
重写它有助于避免嵌套问题:
function logFetch(url) {
return fetch(url)
.then(response => response.text())
.then(text => {
console.log(text);
}).catch(err => {
console.error('fetch failed', err);
});
}
但是,当存在长串的异步依赖项时,基于 Promise 的代码仍然可能难以读取。
Chrome 现在支持 async
和 await
JavaScript 关键字,让您能够编写基于 Promise 的 JavaScript,这些 JavaScript 可以采用同步代码的形式进行结构化且可读取。
相反,我们的异步函数可以简化为:
async function logFetch(url) {
try {
const response = await fetch(url);
console.log(await response.text());
}
catch (err) {
console.log('fetch failed', err);
}
}
Jake 发布了一篇精彩的博文:异步函数 - 让 promise 变得友好,其中包含所有细节。
永久性存储
永久性存储源试用现已结束。您现在可以将 Web 存储标记为永久性,防止 Chrome 自动清除网站的存储空间。
if (navigator.storage && navigator.storage.persist) {
navigator.storage.persist().then(granted => {
if (granted)
alert("Storage will not be cleared except by explicit user action");
else
alert("Storage may be cleared by the UA under storage pressure.");
});
}
此外,对于互动度较高的网站、已添加到主屏幕或启用了推送通知的网站,系统会自动向其授予持久性权限。
如需了解完整详情以及如何为您的网站请求永久性存储空间,请参阅 Chris Wilson 的永久性存储博文。
CSS 自动断字
Android 和 Mac 现在支持 CSS 自动断字功能,这是 Chrome 用户请求次数最多的布局功能之一。
Web Share API
最后,您现在可以更轻松地调用以源试用形式提供的新 Web Share API 调用原生共享功能。Paul(网络意图先生)Kinlan 在他的导航器分享博文中提供了所有详细信息。
正在关闭
以上只是 Chrome 55 中面向开发者的多项变更。
如果您想及时了解 Chrome 的最新动态并了解即将推出哪些新功能,请务必订阅,并务必观看 Chrome 开发者峰会的视频,深入了解 Chrome 团队正在做的一些精彩工作。
我叫 Pete LePage