?作者 | 王瑞平
審校 | 云昭
51CTO讀者成長計劃社群招募，咨詢小助手（微信號：TTalkxiaozhuli）
好消息，頁游要重新崛起了！Web上有望產生3A游戲大作了！
經過6年持續不斷的開發，Chrome團隊于當地時間4月6日發布Web GPU。它是一種新型的API，可以讓Web應用程序更多地訪問你的顯卡功能，能夠被用來在網絡上進行高性能3D圖形和數據并行計算。
當日，Chrome團隊還激動地宣布：“Web GPU可以在Chrome 113中默認可用，目前仍處于Beta測試階段。”
具體來講，Web GPU能夠顯著降低相同圖形規模下JavaScript的工作負載量。不僅如此，它還將機器學習模型的效率提升了3倍以上。相較于前幾年發布的WebGL版本，新的WebGPU具有靈活GPU編程和高級功能訪問能力。
順便說一句，WebGPU的初始版本能夠在ChromeOS、macOS和Windows上使用，對其它平臺的支持功能將在今年晚些時候推出。
1、邁入大瀏覽器時代
眾所周知，所有顯卡在使用之前都要安裝對應的驅動程序，只有顯卡驅動程序與應用程序以圖形API的形式互聯，才能讓顯卡完成圖形渲染與并行計算等工作。
WebGPU的初始版本可在Chrome 113、支持Vulkan的ChromeOS設備、支持Direct3D 12的Windows設備和macOS上使用。而且，Linux、Android以及對現有平臺的擴展支持將很快推出。除了Chrome的初始實現外，Web GPU目前還可以在Firefox和Safari中運行。這標志著正式邁入大瀏覽器時代。
從專業的角度來講，Chromium能夠通過Dawn模塊實現Web GPU的API。Dawn中的DawnNative模塊與3大圖形API溝通，向上為DawnWire模塊傳遞信息。DawnWire模塊與JavaScript API溝通，通過C++語言實現最終的API。
FireFox則用Rust語言以及與Dawn類似模塊實現Web GPU的API。Safari是通過更新WebKit實現的API。
2、功能高級在哪里？
WebGPU是一種新的Web API，它公開了現代硬件功能并允許在GPU上進行渲染和計算操作，類似于Direct3D 12、Metal和Vulkan。與API的WebGL系列不同，WebGPU提供對更高級GPU功能的訪問，并為GPU上的一般計算提供一流的支持。
與Direct3D12、Metal和Vulkan相似的是，Web GPU允許在GPU上進行渲染和計算操作。具體來講，Web GPU作為前些年Web GL的升級版，不僅使用戶能夠訪問更高級GPU，還為GPU上的一般計算提供高級支持。
不僅如此，該API在設計時充分考慮Web平臺的特點，開發出符合用戶習慣的JavaScript API與Promises 集成、支持導入視頻和完備錯誤提示信息的完善開發者體驗。
未來，Web GPU的初始版本將被用作更新和增強功能的構建模塊。同時，該API也將提供更高級的圖形功能，并鼓勵開發人員申請其它功能。
此外，Chrome團隊還計劃在“Web GPU著色語言”中進行更多的機器學習優化和額外的人體工程學調整，從而能夠對著色器核心進行深入訪問。
3、性能秒殺WebGL
那么，舊版本的WebGL與WebGPU在性能與參數方面究竟有何差異？在渲染性能上，WebGL比WebGPU快3倍以上。在計算性能上，WebGPU比WebGL快50倍以上。
在參數方面，WebGL的請求參數簡單，主要包括性能參數和功能參數。而WebGPU分成兩個階段，請求適配器時可以對性能作要求，請求設備對象時可以對GPU各個方面的參數作校驗，確定是否滿足程序要求。
此外，WebGL的CPU開銷比WebGPU更高，因此使用WebGPU實現相同的渲染工作負載可能會更節能，即使GPU本質上是在做同樣的工作。
總之，WebGPU是一個精確的圖形API，完全釋放出顯卡的能力，減輕了瀏覽器開發者的負擔，有別于WebGL這樣的上層API。
4、Web GPU的多線程與通用計算能力
Web GPU可以更好地在線程中執行多種與現代圖形API相關的渲染任務，包括：在線程中更新資源（如更新buffer）、并行地編譯shader、并行地創建pipeline state、在線程中創建command buffer等。
目前，有兩種方法實現多線程：第一種方法是通過OffscreenCanvas API，實現主線程與渲染線程分離；第二種方法是創建worker，在worker中執行WebGPU相關的渲染任務。
具體來講，WebGPU用Pipeline Object設置渲染管線中的相關信息分為兩個階段：“記錄命令”和“提交命令”。“記錄命令”是一個純CPU進程，可以分別記錄在多個Worker（多線程）中，然后提交到同一個隊列中。“提交命令”就是讓GPU根據隊列中的命令順序執行任務。
通過多線程，Web GPU上下文可以由多個工作人員共享。這些worker只要在時間線上沒有互斥操作都可以正常運行。這無疑帶來了良好的開發體驗。
此外，Web GPU還體現出強大的通用計算能力，通過計算著色器，使用GPU中 CU（Compute Unit，計算單元）旁邊的共享內存，速度比普通的顯存速度快得多。
總的來講，Web GPU可以減少CPU開銷，提供對多線程的良好支持，使用計算著色器將通用計算的強大功能引入Web，未來，還將支持“實時光線追蹤”技術。
5、新體驗：Web3D終于迎來曙光
那么，從用戶層面來講，Chrome支持Web GPU會帶來哪些全新的體驗變化呢？
由于WebGPU的顯卡被開放，便于瀏覽器直接運用GPU完成各種操作命令，成功實現3D圖形渲染能力質的飛躍。此外，它還便于開發者為瀏覽器編寫“更酷炫”的游戲，大幅度提升頁游畫面表現。
WebGPU落地的最大意義還是在于人工智能方面。根據谷歌的說法，WebGPU改變了“機器學習模型”。例如，有了WebGPU，瀏覽器直接就能借助NVIDIA顯卡調用AI繪畫所需要的算力和功能。Stable Diffusion的本地化部署可能就真的只用動動鼠標就行。
未來，WebGPU一定能在Web端釋放現代圖形處理器（GPU）的強大能力，無論是頁游，亦或是通用并行計算帶來的機器學習與AI能力。
6、WebGL與WebGPU實現兼容
值得一提的是，Web GPU是W3C“Web GPU”社區小組共同努力的結果。不乏來自Mozilla、蘋果、英特爾和微軟等大公司的貢獻。從2017年開始設計以來，經過6年的開發(90位貢獻者、2000次提交、3000個問題)，團隊終于實現Web GPU在Chrome中可用，也可支持Firefox和Safari。
無論是Chrome的Dawn庫，還是Firefox的WGPU庫均可作為獨立包使用。它們還具有可移植性和人體工程學層，抽象出GPU API操作系統。在本機應用程序中使用這些庫時，開發者還可以更容易地通過Emscripten和Rust web-sys移植到WASM。
幸運的是，許多廣泛使用的WebGL庫已經與WebGPU實現兼容。如果要切換WebGPU可能只需要進行一行配置。具體來講，Babylon.Js已經完全支持WebGPU、PlayCanvas可初步支持WebGPU、TensorFlow.Js支持大多數操作符的WebGPU優化版本、Js WebGPU支持正在實現。
7、內部人士爆料：未來可期
一位自稱參與WebGPU開發的谷歌內部人士稱：這是一個巨大的里程碑。早在他開發高級2D渲染器vello時，就意識到WebGPU會成為游戲規則的改變者。有了它之后，我們可以在任何地方都運行起相當現代的基礎架構：Web、Windows、Mac、Linux、ChromeOS、iOS和Andriod。
此外，他還指出，通過WebGPU，運行機器學習負載的性能在1.0版本中有所不足，但想要趕上本地運行只是一個工程問題，完全可以實現的。
同時，他還爆料WebGPU團隊正在開發本地擴展，以期實現人人想要的Bindless，有助于推動Web標準化。
8、網友吐槽：遲到的里程碑
Reddit上不少網友對于現在才推出WebGPU感到有些遺憾。“移動網絡上GPU加速更常見的用例是2D游戲。即使在低端設備上，使用Pixi類似的東西，就已經足夠快了。”
也有人認為有了WebGPU之后，PC或者桌面可能回到90年代的流行度。
還有一位前端網友認為，WebGPU沒有囊括“現代圖形API設計”的重要發展方向：無綁定（Bindless）、網格著色器、光線追蹤、靈活的管道狀態等等，這些WebGPU目前都沒有出現。因此他感嘆：WebGPU是不是來得有點晚了！
9、寫在最后
正如上文所說，WebGPU的發布，將會給PC帶來翻盤的可能。但目前WebGPU表示基準是桌面+移動設備都支持，但未來的擴展應該支持僅限桌面的用例。
也許，PC作為AI技術最為前沿和先進的載體，WebGPU的出現，再加上WASM和Rust的后端支持，超越“小程序時代”的“大瀏覽器時代”即將來臨！
參考資料：
https://www.theverge.com/2023/4/6/23673462/google-webgpu-chrome-113-api-machine-learning
https://blog.csdn.net/qq_43479892/article/details/122505601
https://developer.chrome.com/blog/webgpu-release/
