豐富手持裝置多媒體介面　OpenVG繪圖引擎成效顯著

由於網路頻寬快速提升，以及使用者所擁有的裝置運算能力不斷增加，能夠呈現高度動態變化與互動能力的多媒體互動介面已普遍為廣大消費者所接受，像是奧多比(Adobe)Flash平台已廣泛應用於網路上的動畫、遊戲與影片。而這種多媒體互動介面已經漸漸成為網路瀏覽介面的一種必要規格，包括第三代行動通訊標準(3GPP)、開放手機聯盟(OMA)、以及活動圖像專家組織(MPEG)都著手制定屬於行動服務之豐富多媒體規格。

例如圖1為3GPP所制定的動態互動多媒體場景(DIMS)系統架構圖；而圖2則是MPEG所制定的LASeR系統架構圖。目前主流的行動服務豐富多媒體規格都是架構在簡化版可縮放向量圖形(SVG Tiny)技術上，做為核心的場景管理以及內容呈現，並且加入互動指令與內容傳輸協定增加其互動能力。

資料來源：3GPP 圖1　DIMS系統架構圖

資料來源：MPEG 圖2　LASeR系統架構圖

由於行動服務之豐富多媒體規格大都是建構在SVG Tiny向量圖形介面技術上，因此在一個Rich Media Player的架構中，向量圖形的處理技術將會是該豐富多媒體播放器效能的關鍵。OpenVG是Khronos Group針對二維(2D)圖形硬體加速所制定的應用程式中介層(API)。針對SVG Tiny技術，OpenVG可透過硬體加速提供高效能向量繪圖能力，以確保在日益複雜的多媒體互動內容能夠流暢的顯示以及與使用者進行互動。

然而，目前終端裝置的硬體能力，例如運算能力、記憶體儲存容量、電池壽命等，仍舊不及個人電腦(PC)，且受到許多限制，所以豐富多媒體播放器在行動裝置的效能表現變成是一個很重要的考量。

一個多媒體互動介面的存在價值不在於畫面多吸引人，而是能提供高效能、高操作反應速度的使用體驗。雖然終端裝置硬體能力越來越提升，也有特定硬體針對2D/3D圖形的加速來提高效能，但必須要有良好的架構設計才能充分發揮硬體所提供的特性，達到最流暢的畫面顯示以及操作經驗。

有鑑於此，資策會以SVG Tiny做為場景管理以及內容描述的核心，並採用Open VG繪圖引擎為底層開發出豐富多媒體播放器。

本文將針對目前主流的SVG Tiny技術以及採用的繪圖引擎OpenVG技術，以效能取向去探討Rich Media Player的架構，其中包含了OpenVG的基礎架構，以及利用現有OpenGL或OpenGLES硬體加速器提供OpenVG硬體加速能力，還有SVG Tiny技術如何與OpenVG整合成高效能的豐富多媒體播放器架構。

SVG為豐富多媒體格式核心

可縮放向量圖形是基於可擴展標記語言(XML)所發展，用於描述二維向量圖形的一種圖形格式，是由全球資訊網協會(World Wide Web Consortium, W3C)制定的開放標準(圖3)。該格式遵從XML所定義的語法，並使用文本格式的描述性語言來描述圖像內容，因此和圖像解析度無關，傳統點陣式圖形會因為解析度的縮放而產生鋸齒狀的模糊，向量式圖形則沒有這個缺點(圖4)。

資料來源：SVG WIKI 圖3　SVG為基於XML的一種圖形格式

資料來源：SVG WIKI 圖4　傳統點陣式圖形(左)與向量式圖形格式(右)的差異

以DIMS與LASeR兩套豐富多媒體標準來說，都是以SVG做為整個架構的核心，因為SVG是基於XML所發展的描述性語言，文件內容可以像XML一樣以樹狀結構表示文件內容，每個元件都是樹狀結構內的節點並獨立存在，這樣的結構可以用來做為場景管理使用，使用者可以藉由存取節點的資料來管控整個SVG場景中的物件。

此外，SVG支援延伸文件物件模型(DOM)而來的uDOM(Micro Document Object Model)，提供了程式介面可以去針對節點的元件作存取以及修改內部參數資料的能力，並且uDOM也提供事件處理以及觸發的機制，可以實現動態產生和互動功能。

在uDOM的基礎上，SVG開發設計人員可以利用ECMAScript或者SMIL來進行時序控制或元件的動態操控。因此SVG的能力除了包含向量顯示對象的呈現外，還能夠提供處理互動式情境的功能，這正是豐富多媒體的功能核心所在，因此所提的LASeR以及DIMS這兩種標準都以此做為核心基礎，各自延伸不同的功能因應不同的需求。

行動豐富多媒體經驗有賴OpenVG加持

在過去，由於嵌入式系統上沒有繪製2D向量圖形的統一規格，因此在處理2D向量圖形的相關內容時，各家業者都會開發自己專屬的二維繪圖API來進行底層的繪製。這樣的作法大多仰賴中央處理器(CPU)處理大量的運算，對於電力的消耗以及整體運算資源的分配是一大考驗；此外，當開發者想要將產品移植到不同的平台時，可能又得負擔額外的工作來處理底層銜接的問題。

也因此Khronos組織於2004年第四季首先提出適合於硬體加速的二維向量圖形處理標準函式庫--OpenVG，並於2005年8月釋出1.0版的OpenVG規格，並於2008年12月釋出1.1版，加強對文字，反鋸齒效果，以及對Flash的支援。目前OpenVG規格由Khronos所主導，結合多家行動裝置大廠及圖學組織，包括諾基亞(Nokia)、摩托羅拉(Motorola)、Bitboys、Hybrid Graphics、Symbian、昇陽(Sun Microsystems)、3Dlabs等公司，目標在規範提供適合嵌入式系統環境上簡單、輕便且低階的2D向量圖形繪圖引擎之功能。

藉由公開的標準、統一的規格，不僅硬體製造商可依據其規格設計出二維向量圖形硬體加速晶片，同時也能加快二維向量圖形展現技術與硬體加速晶片垂直整合的速度。說穿了，OpenVG目的就是提供硬體抽象層，達到跨平台的功能，使得使用OpenVG API開發的應用程式，在不同平台執行時，皆可取得二維向量圖形硬體加速的功能。

在Rich Media Player中，SVG扮演的角色是做為場景管理以及內容描述。SVG的執行流程如下：首先，由於SVG是以基於XML文本格式的描述性語言描述內容，所以必須先透過語法解析器(Parser)去對檔案內容做解析，然後將XML標籤所代表的元件以樹狀資料結構表示，每個元件都是樹狀資料結構內的節點，透過SVG的使用者代理程式(User Agent)模組巡訪資料結構，判斷節點記錄的物件是否參與繪製流程，建構繪製時需要的顯示命令序列(Display List)，接著使用者代理程式處理顯示命令序列的資料，透過呼叫底層負責繪製的二維向量圖形API完成向量圖形的繪製(圖5)。

來源：IEEE:Design of an efficient scalable vector graphics player for constrained devices 圖5　SVG處理流程

依據以上所提的處理流程，可以將SVG分為語法解析器、使用者代理程式、2D向量圖形繪圖引擎三個模組，其中語法解析器負責解析SVG檔案內描述的內容，並且將所描述元件以樹狀結構儲存，以供使用者代理程式處理；巡訪語法解析器建出來的資料結構，處理內容所需要的動畫內插計算，以及多媒體的影音同步的資訊或者是所需要外部連結，依據內容產生顯示命令序列，再透過這顯示命令序列去呼叫底層所採用的向量繪圖引擎的API來繪製內容(圖6)。

圖6　Rich media Player架構以及核心模組661205

在開發處理SVG的系統架構中，效能考慮的關鍵有幾個重點：記憶體空間的使用量、資料結構的巡訪次數、繪圖流程針對底層繪圖引擎的最佳化；這三者的設計攸關是否能有效利用有限裝置所提供的運算能力以及資源。

以記憶體容量來說，當SVG內容越複雜，使用的元件越多表示樹狀結構的節點也越多，耗費的記憶體也越多，節點資料結構的設計就會大大影響記憶體的使用量。對SVG所制定的檔案格式來說，有許多不同屬性以及功能的元件，例如路徑(Path)、矩形(Rect)、圓(Circle)、稜線(Polyline)等。每個元件的屬性結構雖然有大多數可以共通，但是採用一個共同的資料結構表示所有的元件，必須考慮到所有可能的屬性，這樣一來實際使用上將會出現許多可能完全不會使用到的空欄位，明顯造成記憶體空間使用的浪費。因此，研發團隊在設計時，先定義相同屬性共通的結構，再針對不同元件增加需要的欄位去組成其資料結構，所有的元件會擁有各自的資料結構，避免浪費不必要的欄位空間。

此外，語法解析器所建出來的樹狀資料結構，經由使用者代理程式的處理，產生的顯示命令序列也是為了降低記憶體的使用量，巡訪的過程中只會在記憶體保留應該要被處理的節點，將其建構成顯示命令序列供繪製使用，如圖7所示，使用顯示命令序列可以節省不需要處理的節點耗費的記憶體空間，並且減少使用者代理程式巡訪節點的次數。

資料來源：IEEE:Design of an efficient scalable vector graphics player for constrained devices 圖7　樹狀結構經過處理成為顯示命令序列

在設計底層繪圖流程最佳化這方面，也必須針對所採用的繪圖引擎去做剖析，有效利用其函式庫提供的加速特性，並且避免使用耗費效能的流程設計。研發團隊在設計底層繪圖流程採用了快取機制，在語法解析器建構樹狀結構的同時，就會預先將底層OpenVG函式庫API所需要的資料結構初始化，並且暫存於記憶體中，等到傳送顯示命令序列給繪圖引擎時，就重覆使用這些預先初始化好的資料來做繪製。另外研發團隊也設計了動態更新機制，處理SVG動畫可能必須新增向量基本元件資料的需求。會這樣設計的原因是由於OpenVG在處理向量基本元件的初始化，有幾個步驟所需的效能是較為吃重的，所以能夠預先準備好資料，盡量避免在繪製的流程中重覆做初始化的動作，可以有效得到效能的提升，更可以在記憶體管理上避免頻繁地執行配置記憶體、釋放記憶體的動作。

在終端裝置硬體的能力有限的情況下，豐富多媒體播放器效能的表現會影響使用者的使用經驗與感受，系統架構設計必須考慮到每個環節才能夠充分利用手上有的資源，以上所提的重點考量是研發團隊在開發豐富多媒體播放器所得到的相關經驗：終端裝置硬體的記憶體容量有限，必須注意記憶體空間的使用，所以資料結構的設計必須考量有效的利用這有限的記憶體大小；而CPU運算的負擔也跟電力損耗息息相關，所以節省CPU的使用率，盡量減少不必要的計算以及巡訪次數，利用底層2D向量圖形繪圖引擎與硬體加速的支援，將繪製的工作交給專門的硬體，可以達到最佳的顯示效果並且分擔CPU的負載。

利用OpenVG函式庫實作SVG　有助提升繪圖效能

SVG這個格式的表現內容是以向量圖形為主。採用向量圖形的好處在於，向量圖形不像點陣圖形必須記錄每個畫素的顏色，再由各種顏色的分布來組成圖形中物體的形狀。

點陣化的做法有些明顯的缺點，因為當系統要表現更多畫面細節，例如將物體放大檢視時，就必須在畫面中填入更多的像素才不會使畫面出現失真的狀況。這也代表為了確保在使用者可控制的檢視範圍內圖形不會出現失真現象，所有的圖片資訊都必須以最大的解析度傳遞到使用者端，如此不但限制了使用者對圖形的互動能力，也容易造成頻寬上的負擔與浪費。

向量圖形的概念則是以形狀為主軸，各種圖形的形狀由幾何描述所構成，例如線段、曲線、弧線等，物體的顏色則是在幾何輪廓內部填入色彩、漸層等。由於向量圖形的資料是採用較為抽象的幾何描述，傳遞至使用者端的資料並不會受到解析度的影響而改變。

當使用者接收到向量圖形時，可以任意選擇所需的解析度，並依據該解析度將向量圖形的幾何描述轉換成點陣圖形式呈現於電腦螢幕上。由於多媒體互動介面中的圖形資訊量龐大，加上使用者對多媒體互動介面有很高的互動控制能力，利用向量圖形可以有效的提高資訊利用率以及多媒體互動介面的表現力。

而SVG的底層繪製就是採用OpenVG的向量繪圖函式庫，所以SVG所表現出來的效能跟OpenVG息息相關，下期作者將會對OpenVG的規格以及利用OpenGL實做OpenVG的經驗做介紹，分析利用硬體加速的OpenVG在效能上的優勢。軟體實作的畫素運算在支援硬體加速下，均交由高速的繪圖處理單元(GPU)進行處理，不管是在個人電腦或是手持裝置平台，都能達到數倍的效能增益。這也是資策會研發團隊採用OpenVG做為SVG底層繪圖引擎的原因。

可攜式豐富多媒體播放棄設計考量首重平衡

總結來說，當終端裝置是可攜式設備時，由於硬體的記憶體容量有限，因此必須更注意記憶體空間的使用效率。所以，研發人員在進行資料結構的設計時，必須盡可能有效率地利用這有限的記憶體空間。

功耗也是可攜式裝置非常重視的指標。從軟體開發的角度來看，若軟體工程師所開發的程式可以將對CPU所造成的運算負擔降到最低，將有助於降低系統的電力損耗。所以，軟體工程師在開發豐富多媒體播放器時，必須節省CPU的使用率，盡量減少不必要的計算與巡訪次數。利用底層2D向量圖形繪圖引擎與硬體加速的支援，將圖形的繪製工作交給專門的硬體來負責執行，有助於達到最佳的顯示效果，並分擔CPU的負載。

(本文作者任職於資策會網路多媒體研究所)