Chrome 83 穩(wěn)定版發(fā)布了，以下是最主要的更新內(nèi)容：

• 可信類(lèi)型（Trusted types），有助于防止跨站點(diǎn)腳本漏洞

• 新的表單元素

• 新的跨域政策

• 引入 Web Vitals 計(jì)劃

• 檢測(cè)內(nèi)存泄漏的新方法

可信類(lèi)型（Trusted types）

基于 DOM 的跨站點(diǎn)腳本（DOM XSS）是最常見(jiàn)的 Web 安全漏洞之一。可信類(lèi)型（Trusted types）可以幫助防止此類(lèi)漏洞，因?yàn)樗鼈儠?huì)要求你在將數(shù)據(jù)傳遞給潛在的危險(xiǎn)之前對(duì)其進(jìn)行處理。

以innerHTML為例，如果啟用了可信類(lèi)型，那么如果嘗試傳遞一個(gè)字符串，它將拋出一個(gè)TypeError，因?yàn)闉g覽器不知道它是否可以信任該字符串。

//Trustedtypesturnedonconstelem=document.getElementById('myDiv');elem.innerHTML=`Hello,world!`;//WillthrowaTypeError

相替代地，需要使用諸如textContent之類(lèi)的安全函數(shù)，傳入可信類(lèi)型，或者創(chuàng)建該元素并使用appendChild()。

//Useasafefunctionelem.textContent='';//OK//PassinatrustedtypeimportDOMPurifyfrom'dompurify';conststr=`Hello,world!`;elem.innerHTML=DOMPurify.sanitize(str,{RETURN_TRUSTED_TYPE:true});//Createanelementconstimg=document.createElement('img');img.src='xyz.jpg';elem.appendChild(img);

更新表單控件

Chrome 和 Edge 進(jìn)行了合作，以改善 HTML 表單控件的外觀和功能。下圖顯示了 Chrome 中某些控件的新舊版本對(duì)比（左舊右新）。

除了新的視覺(jué)風(fēng)格之外，微軟還提供了更好的觸摸支持和輔助功能，同時(shí)改進(jìn)了鍵盤(pán)支持。

• Largest Contentful Paint會(huì)測(cè)量感知的加載速度，并在頁(yè)面的主要內(nèi)容可能已加載時(shí)標(biāo)記頁(yè)面加載時(shí)間軸中的點(diǎn)。

• First Input Delay 可測(cè)量響應(yīng)度，并量化用戶(hù)在首次嘗試與頁(yè)面進(jìn)行交互時(shí)的體驗(yàn)。

• Cumulative Layout Shift 可衡量視覺(jué)穩(wěn)定性，并量化可見(jiàn)頁(yè)面內(nèi)容的意外布局移位量。

Origin trials

用measureMemory()測(cè)量?jī)?nèi)存

performance.measureMemory()是一個(gè)新的 API，可用于測(cè)量頁(yè)面的內(nèi)存使用情況并檢測(cè)內(nèi)存泄漏。

更新原生文件系統(tǒng) API

原生文件系統(tǒng)（Native File System）API 在 Chrome 83 中啟動(dòng)了一項(xiàng)新的源程序試用版，該版本支持可寫(xiě)流，并且可以保存文件句柄。

asyncfunctionwriteURLToFile(fileHandle,url){//CreateaFileSystemWritableFileStreamtowriteto.constwritable=awaitfileHandle.createWritable();//MakeanHTTPrequestforthecontents.constresponse=awaitfetch(url);//Streamtheresponseintothefile.awaitresponse.body.pipeTo(writable);//pipeTo()closesthedestinationpipeautomatically.}

可寫(xiě)流使寫(xiě)入文件變得更加容易，并且可以輕松地將響應(yīng)從一個(gè)流傳輸?shù)搅硪粋€(gè)流。

將文件句柄保存到 IndexedDB 允許用戶(hù)存儲(chǔ)狀態(tài)或記住用戶(hù)正在處理哪些文件。例如，保留最近編輯的文件列表、打開(kāi)用戶(hù)正在使用的最后一個(gè)文件等等。

其他

• Chrome 現(xiàn)在支持條形碼檢測(cè) API，該 API 提供了檢測(cè)和解碼條形碼的功能。

• 新的 CSS @supports 函數(shù)為 CSS 選擇器提供功能檢測(cè)。

• 新的 ARIA 注釋支持屏幕閱讀器可訪問(wèn)帶有語(yǔ)義（類(lèi)似于<mark>的語(yǔ)義）的注釋、建議和文本高亮。

• Preferreds-Color-Scheme 媒體查詢(xún)使作者能夠選擇自己的深色主題，他們可以完全控制自己構(gòu)建的體驗(yàn)。

• JavaScript 現(xiàn)在支持共享工作程序中的模塊。

詳情可查閱：https://developers.google.com/web/updates/2020/05/nic83

總結(jié)

以上是生活随笔為你收集整理的谷歌 Chrome 83 稳定版正式发布：新跨域政策、表单控件，改进 Web 体验的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。