Chrome 63 Beta新特性介紹

Chrome 63 Beta新特性介紹

除非另外註明,否則,下面介紹的更改均適用於最新 Chrome Beta 渠道版(Android、Chrome 操作系統、Linux、Mac 和 Windows)。

動態模塊導入

目前,導入 JavaScript 模塊是完全靜態的,開發者無法根據運行時條件(例如用戶是否登錄)導入模塊。從這個版本開始,開發者可以利用 import(specifier) 語法在運行時動態加載代碼到模塊和腳本中。這一功能可用於僅在需要時延遲加載腳本,從而提升應用的性能。

button.addEventListener('click', event => {

import('./dialogBox.js')

.then(dialogBox => {

dialogBox.open();

})

.catch(error => {

/* Error handling */

});

});

上面的代碼示例顯示瞭如何在某個事件後使用 import(specifier) 函數導入 JavaScript。

異步迭代器和生成器

編寫通過異步函數執行任何迭代的代碼不是很好的做法。現在,我們推出使用異步迭代協議的異步生成器函數,幫助開發者簡化流式傳輸數據源的消耗或實現。異步迭代器可用於 for 循環以及通過異步迭代器工廠創建自定義異步迭代器。

async function* getChunkSizes(url) {

const response = await fetch(url);

for await (const chunk of streamAsyncIterator(response.body)) {

yield chunk.length;

}

}

上面的代碼示例顯示瞭如何使用異步迭代器通過 streamAsyncIterator 函數編寫更簡潔的代碼來流式傳輸提取的數據。

Device Memory API

由於設備的能力不同,開發者要想打造一種適合所有設備的用戶體驗困難重重。全新的 Device Memory JavaScript API 可以通過用戶設備上的總內存來詳細瞭解設備限制,從而幫助開發者應對這個挑戰。開發者可以利用這一數據分析按照硬件限制在運行時定製內容。例如,開發者可以向使用低端設備的用戶提供精簡版應用,從而改進用戶體驗和降低用戶的失望感。Device Memory API 也可用於向指標添加環境信息,例如從設備內存的角度來顯示某個任務在 JavaScript 中完成所需的時間。

權限界面更改

在網站需要用戶提供特殊權限時,它們可以觸發權限請求。目前,這些權限請求在 Chrome(Android 版)中以可忽略的橫幅形式顯示在屏幕底部,開發者在呈現這些請求時通常沒有考慮用戶是否有合適的環境來授予權限。這會影響用戶體驗,用戶在超過 90% 的情況下都會忽略或暫時拒絕這些權限請求。

在 Chrome 59 中,我們著手解決這個問題,如果用戶忽略某個權限請求達到三次,我們會暫時屏蔽這一權限。作為跟進,在這個版本中,Chrome(Android 版)現在以模態對話框形式呈現權限請求。這一變化可以將整體的權限提示次數減少 50%。它也將用戶接受或拒絕請求的可能性提高了 5 倍,而不是讓他們暫時拒絕或重複忽略請求。為了確保用戶理解權限請求,開發者應在適當的時間向用戶呈現權限請求,因為我們發現,如果網站在一定環境下要求權限,用戶授予相關權限的可能性要高 2.5 倍。

查看更多文章,請關注『谷歌開發者』官方微信公眾號


分享到:


相關文章: