圖形處理單元 （GPU） 越來越多地包含在 SoC 中，驅(qū)動嵌入式系統(tǒng)和連接的消費電子產(chǎn)品。GPU 可以被認為是適合顯示渲染的額外處理器，并且用戶界面通常構(gòu)成整體產(chǎn)品質(zhì)量的主要指標，因此最好盡可能地利用它是有意義的。消費電子產(chǎn)品通常依賴 HTML 瀏覽器來提供構(gòu)建 UI 和其他應(yīng)用程序的表示層。在這里，我將看看一些瀏覽器如何使用 GPU，并將其與更集中的方法進行對比。

每當頁面的任何部分發(fā)生變化時，瀏覽器都需要重新繪制屏幕，同時最大限度地減少 CPU 的工作量。他們通過跟蹤屏幕上所有需要更新的區(qū)域來做到這一點，然后僅重新繪制這些區(qū)域以及與它們重疊的任何其他屏幕元素的部分。

大多數(shù)瀏覽器使用 CPU 將這些元素的表示繪制成像素圖。通常，要顯示的下一幀是通過獲取前一幀并覆蓋更改來創(chuàng)建的，如圖 1 所示。如果可用，GPU 用于將前一幀和部分像素圖數(shù)據(jù)組合到下一幀中，從而釋放 CPU其他任務(wù)。

為了提高性能，許多瀏覽器使用加速合成，這是一種將頁面中不交互的部分組合在單獨的層中并獨立操作這些部分的技術(shù)。這種技術(shù)本質(zhì)上是內(nèi)存和 CPU 使用之間的權(quán)衡。當發(fā)生任何變化時，GPU 會將代表每一層的像素圖合成到幀緩沖區(qū)中，但 CPU 仍用于繪制這些像素圖的內(nèi)容。如圖 2 所示，圖層的組合始終覆蓋整個屏幕，因此無需訪問前一幀的副本。

使用 GPU

盡管 GPU 提供了相當大的靈活性，但瀏覽器在接受其全部優(yōu)勢方面的速度相對較慢。瀏覽器設(shè)計的相互關(guān)聯(lián)性使得重新設(shè)計核心組件（例如渲染）以利用截然不同的硬件功能變得復(fù)雜。因此，大多數(shù)瀏覽器設(shè)計仍然將 GPU 視為增強的 blitter，并將其主要用于加速合成。

一段時間以來，瀏覽器提供商一直在尋求超越簡單的“GPU 作為一個 blitter”場景。使用 GPU 而不是 CPU 來處理繪畫被稱為 GPU 光柵化。一些瀏覽器包括使用擴展圖形庫啟用 GPU 光柵化的選項，這些圖形庫將繪畫任務(wù)傳遞給 GPU。這些庫滿足廣泛的使用場景，因此提供靈活的通用 API。不幸的是，這些 API 的靈活性對于 HTML 所需的用例來說過于復(fù)雜，這會導(dǎo)致 GPU 的使用欠佳，從而導(dǎo)致渲染性能下降。

GPU 性能來自于能夠有效地執(zhí)行大量類似的批處理操作，為管道提供數(shù)據(jù)以確保它們得到最佳填充。這些擴展圖形庫提供的靈活性通常會導(dǎo)致無法保持 GPU 的管道滿載，從而顯著降低其效率。

為了充分利用 GPU，它的管道必須保持滿載；僅關(guān)注 HTML 的要求并將其與 GPU 功能相匹配是關(guān)鍵。HTML 的特性非常適合 GPU 加速。元素本質(zhì)上是矩形的，自然網(wǎng)格對齊，并且很少使用抗鋸齒。由于 GPU 處理三角形，因此每個矩形 HTML 元素可以使用兩個。HTML 所需的圖形基元集也相對較小，這意味著特定于 HTML 的 GPU 加速圖形 API 是一個現(xiàn)實的目標。

GPU 光柵化過程與 CPU 完全異步發(fā)生。這意味著 CPU 可以在繪制任務(wù)完成之前開始處理腳本和布局等后續(xù)任務(wù)。GPU 光柵化也改變了優(yōu)化獎勵平衡。在 CPU 上，性能優(yōu)化是通過僅更新屏幕中已更改的那些區(qū)域來實現(xiàn)的。而在 GPU 上，最好跟隨游戲行業(yè)的領(lǐng)先地位，每幀更新整個屏幕。雖然重新繪制每一幀上的每個像素似乎違反直覺，但在大多數(shù)情況下，重新繪制整個屏幕的處理成本低于 CPU 管理部分更新所需的計算成本。

Ekioh在其新的多線程 HTML 瀏覽器中使用了上述技術(shù)并取得了成功。在圖形繁重的應(yīng)用程序中，發(fā)現(xiàn)集中使用 GPU 的速度是更通用的基于庫的方法的兩倍多。此外，由于 GPU 光柵化不需要用于加速合成的大量緩存像素圖，因此在某些情況下可以節(jié)省大量內(nèi)存（超過 45 MB）。隨著屏幕分辨率的提高，這些內(nèi)存節(jié)省將變得更加顯著。

因此，集中使用 GPU 是在不犧牲性能的情況下降低成本的關(guān)鍵。使用這種方法，下一代嵌入式芯片將能夠在大眾市場消費電子產(chǎn)品上提供基于瀏覽器的 4K 應(yīng)用程序和 UI，而不會降低性能。

審核編輯：郭婷