2021 年 Web 領(lǐng)域有哪些關(guān)鍵進(jìn)展？
大家好，我是 ConardLi ， W3C 年度全球技術(shù)大會(huì)（ TPAC 2021 ）在今年10月份舉辦，隨后他們發(fā)布了今年 10 月份的 W3C工作重點(diǎn)報(bào)告 。
這份報(bào)告匯總了今年4月份以來在 Web 領(lǐng)域的一些關(guān)鍵進(jìn)展，我挑了一些我比較感興趣的，大家一起來看一下吧。
W3C
可能很多小伙伴對(duì) W3C 還不太了解，萬維網(wǎng)聯(lián)盟（ World Wide Web Consortium ，簡(jiǎn)稱 W3C）創(chuàng)建于1994年，是 Web 技術(shù)領(lǐng)域最具權(quán)威和影響力的國(guó)際中立性技術(shù)標(biāo)準(zhǔn)機(jī)構(gòu)。
W3C 目前包括 42 個(gè)工作組和 10 個(gè)興趣組 ，我們熟知的很多 Web 標(biāo)準(zhǔn)都由 W3C 定制：
- 超文本標(biāo)記語言（
HTML） - 文檔對(duì)象模型 (
DOM) - 可擴(kuò)展標(biāo)記語言（
XML） - 幫助殘障人士有效獲得
Web內(nèi)容的信息無障礙指南（WCAG）
各種瀏覽器的內(nèi)核實(shí)現(xiàn)不同，導(dǎo)致頁(yè)面解析出來的效果可能會(huì)有差異，所以各種瀏覽器都需要按照統(tǒng)一的標(biāo)準(zhǔn)來實(shí)現(xiàn)。
這些標(biāo)準(zhǔn)有效促進(jìn)了 Web 技術(shù)的互相兼容，對(duì)互聯(lián)網(wǎng)技術(shù)的發(fā)展和應(yīng)用起到了基礎(chǔ)性和根本性的支撐作用。
下面，我們一起來看看 Web 領(lǐng)域的一些最新技術(shù)進(jìn)展。
小程序
MiniApps 指混合移動(dòng)應(yīng)用程序，小巧、免安裝、加載速度快，使用 Web 技術(shù)（尤其是 CSS 和 JavaScript ）并與 Native Apps 的功能集成，也就是我們常說的小程序。
MiniApps工作組 今年發(fā)布了多個(gè)公開草案：
- 5月11日發(fā)布
MiniApp Manifest草案：規(guī)范為應(yīng)用程序manifest提供了額外的元數(shù)據(jù)來描述。 - 6月15日發(fā)布
MiniApp Lifecycle草案：定義了小程序生命周期的事件與管理小程序及各個(gè)小程序頁(yè)面的生命周期流程。
- MiniApp Packaging
- MiniApp
- MiniApp
- JavaScript
音頻 - Web Audio 1.0
Web 音頻工作組 今年6月份發(fā)布 Web Audio API 1.0 為 W3C 正式推薦標(biāo)準(zhǔn), 為 Web 平臺(tái)添加了直接從 Web 瀏覽器操作音樂和創(chuàng)建音頻的標(biāo)準(zhǔn)方法，包括協(xié)作和交互方式。
目前所有主流瀏覽器已實(shí)現(xiàn) Web Audio 1.0 規(guī)范，支持在瀏覽器中合成音頻。瀏覽器提供一個(gè) AudioContext 對(duì)象，該對(duì)象用于生成一個(gè)聲音的上下文，與揚(yáng)聲器相連。
- const audioContext = new AudioContext();
然后，獲取音源文件，將其在內(nèi)存中解碼，就可以播放聲音了。
- const context = new AudioContext();
- fetch('code秘密花園.mp4')
- .then(response => response.arrayBuffer())
- .then(arrayBuffer => context.decodeAudioData(arrayBuffer))
- .then(audioBuffer =>{
- // 播放聲音
- const source = context.createBufferSource();
- source.buffer = audioBuffer;
- source.connect(context.destination);
- source.start();
- });
Web 文本編輯 - 虛擬鍵盤API
Web 文本編輯工作組 在今年8月提交了 虛擬鍵盤API 公開草案。
VK（ Virtual Keyboard ）是指在沒有硬件鍵盤的情況下，可用于輸入的屏幕鍵盤。
VirtualKeyboard API 為開發(fā)者提供了對(duì)虛擬鍵盤（ VK ）可見性的更好控制，以及在 VK 可見性改變時(shí)調(diào)整網(wǎng)頁(yè)布局的更大能力。
- partial interface Navigator {
- [SecureContext, SameObject] readonly attribute VirtualKeyboard virtualKeyboard;
- };
- [Exposed=Window, SecureContext]
- interface VirtualKeyboard : EventTarget {
- undefined show();
- undefined hide();
- readonly attribute DOMRect boundingRect;
- attribute boolean overlaysContent;
- attribute EventHandler ongeometrychange;
- };
機(jī)器學(xué)習(xí) - Web 神經(jīng)網(wǎng)絡(luò) API
Web 機(jī)器學(xué)習(xí)工作組 于今年4月份正式成立。
成立后的兩個(gè)月， Web 機(jī)器學(xué)習(xí)工作組 發(fā)布了 Web 神經(jīng)網(wǎng)絡(luò) API 。
該標(biāo)準(zhǔn)中描述了專門用于神經(jīng)網(wǎng)絡(luò)推理硬件加速的 API，包括了人物檢測(cè)、人臉識(shí)別、超級(jí)分辨率、圖像標(biāo)題、情感分析、噪聲抑制等常見應(yīng)用。
WebRTC - Encoded Transform
媒體捕獲和媒體流 ( Media Capture and Streams ) 和屏幕捕獲 ( Screen Capture ) 目前已經(jīng)發(fā)布為 W3C 正式推薦標(biāo)準(zhǔn)。
WebRTC工作組 目前已將工作重點(diǎn)轉(zhuǎn)向增加其他 API，例如 WebRTC編碼轉(zhuǎn)換 ( WebRTC Encoded Transform ) ，它將與其他技術(shù)一起，在Web瀏覽器上完成從端到端的加密視頻會(huì)議。
瀏覽器自動(dòng)化測(cè)試 - WebDriver API 2.0
WebDriver API 是 W3C 在 2018 推出的的一個(gè)標(biāo)準(zhǔn)，是一個(gè)遠(yuǎn)程控制協(xié)議，它提供了跨平臺(tái)和跨語言的方式來遠(yuǎn)程操控瀏覽器，它提供了一系列接口來訪問和操作 DOM ，進(jìn)而控制瀏覽器的行為。它使得 web 開發(fā)者能寫一些自動(dòng)化腳本來測(cè)試網(wǎng)頁(yè)。
不過因?yàn)樗目鐬g覽器兼容性問題，目前應(yīng)用并不廣泛。 瀏覽器測(cè)試與工具工作組 正在開發(fā) WebDriver API 2.0 版本，目的是能夠像開發(fā)者工具一樣監(jiān)控瀏覽器中發(fā)生的內(nèi)部狀態(tài)變化，并解決它的跨瀏覽器兼容性問題。
身份認(rèn)證 - WebAuthn Level 3
Web 身份驗(yàn)證工作組 今年4月發(fā)布了 Web 身份驗(yàn)證 Level 3 的第一版公開工作草案。
WebAuthn ，即 Web Authentication ，是一個(gè)用于在瀏覽器上進(jìn)行認(rèn)證的 API ， W3C 將其表述為 " An API for accessing Public Key Credentials "，即“一個(gè)用于訪問公鑰憑證的 API”。
WebAuthn 很強(qiáng)大，強(qiáng)大到被認(rèn)為是 Web 身份認(rèn)證的未來。你有想過通過指紋或者面部識(shí)別來登錄網(wǎng)站嗎？ WebAuthn 就能在保證安全和隱私的情況下讓這樣的想法成為現(xiàn)實(shí)。
Web支付 - Payment Request API
支付請(qǐng)求 API（ Payment Request API 1.0 ）現(xiàn)已發(fā)布為 W3C 提案推薦標(biāo)準(zhǔn)，并且最近有望成為正式推薦標(biāo)準(zhǔn)。
當(dāng)用戶嘗試從你的網(wǎng)站購(gòu)買商品時(shí)，網(wǎng)站必須要求用戶提供付款信息以及其他信息（比如收貨信息）。 Payment Request API 就是來幫助我們做這件事情的，下面是一個(gè)小 Demo：
- // 支付方式
- const paymentMethods = [{
- supportedMethods: 'https://xxx.xyz/pay',
- data: {
- ... // 支付應(yīng)用提供的自定義參數(shù).
- }
- }];
- // 付款詳情
- const paymentDetails = {
- displayItems: [{
- label: 'code秘密花園',
- amount: { currency: 'USD', value: '22.15' }
- }],
- total: {
- label: 'ConardLi',
- amount: { currency: 'USD', value : '22.15' }
- }
- };
- const request = new PaymentRequest(paymentMethods, paymentDetails);
分散式標(biāo)識(shí)符 - DID 標(biāo)準(zhǔn)
分散式標(biāo)識(shí)符工作組在今年8月提交了 DID 標(biāo)識(shí)符 1.0 ，這是一個(gè)區(qū)塊鏈領(lǐng)域的技術(shù)，目前 W3C 還在審閱中，未正式發(fā)布。
標(biāo)準(zhǔn)定義了分散式標(biāo)識(shí)符（ DID ），一種用于可驗(yàn)證的去中心化數(shù)字身份的新型標(biāo)識(shí)符。 DID 標(biāo)識(shí)的對(duì)象（例如：人、組織、事物、數(shù)據(jù)模型、抽象實(shí)體等）由 DID 控制者決定。
DID 的基礎(chǔ)是將身份控制權(quán)交還給互聯(lián)網(wǎng)用戶，并授權(quán)他們使用自己信任的系統(tǒng)生成唯一的標(biāo)識(shí)符。通過使用加密證明(如數(shù)字簽名)對(duì)這些標(biāo)識(shí)符進(jìn)行認(rèn)證，個(gè)人和組織都可以利用區(qū)塊鏈的分布式賬本技術(shù)( DLT )從無縫、安全和私有的數(shù)據(jù)交換中獲益。
Web字體 - 增量字體傳輸
Web字體工作組 在今年9月發(fā)布了 增量字體傳輸規(guī)范 的首個(gè)公開工作草案：
規(guī)范定義了從服務(wù)器到客戶端增量傳輸字體的兩種方法。增量傳輸允許客戶端僅加載它們實(shí)際需要的字體部分，從而提升字體加載速度并減少加載字體所需的數(shù)據(jù)傳輸。
其他
Web 應(yīng)用程序安全工作組發(fā)布了關(guān)于Post-Spectre Web開發(fā)的新說明。
- GPU for the Web 工作組
- WebGPU
- WebGPU Shading Language
- Web Transport 工作組
- WebTransport API
- API
Web 工作組 正在完善 WebXR Device API 規(guī)范及其配套規(guī)范，以實(shí)現(xiàn) VR/AR 體驗(yàn)。
