圖片來源: 

iThome

到底RIA(Rich Internet Application)是什麼樣的技術,可以突破靜態網頁的限制?過去若要在網頁中,設計類似桌面應用程式的使用體驗,例如提供不需換頁的介面、酷炫的動畫效果、動態拖拉元件,不是做不到,但事倍功半。

聯銓資訊由於開發商業智慧產品的需要,很早就投入網頁繪圖、3D及動態效果的研究。總經理林健勝表示:「影像、漸層及倒影等效果,用程式硬寫是很辛苦的工作。」

他們花很長的時間,研究艱澀難懂的數學公式,再參考非常有限的資訊,才建置了繪圖函式庫(Library),然而即使克服萬難產出圖形,執行效率卻不盡理想,而且仍有部分繪圖效果是無法做到的。

這些難題,在Flex與Silverlight問世之後迎刃而解。運用RIA技術,動畫加上結合資料庫的圖文呈現,只消幾行程式即能實現。

不過,即使同樣稱為「RIA」技術,Ajax、Silverlight、WPF、Flash、Flex與AIR這些技術之間,仍有差別。

根據研究機構Forrester的分類,RIA分為以瀏覽器為基礎(Browser Based)、以執行環境為基礎(Player Based)及以桌面為基礎(Desktop Based)等3種解決方案。Ajax屬於以瀏覽器為基礎的RIA;Adobe Flash/Flex及微軟Silverlight屬於以執行環境為基礎的RIA;而Adobe AIR或昇陽的JavaFX則是以桌面為基礎的RIA。

就以執行環境為基礎的RIA解決方案來看,企業可由以下6個面向評估採用Silverlight及Flash/Flex的利弊。

評估點1:開發與維護成本

如果Web(Thin Client)和桌面程式(Rich Client)之間是一道由淺到深的光譜,Flash/Flex和Silverlight是介於兩者、兼具Web和桌面程式好處的RIA解決方案。

與其他RIA方案比較,Flash/Flex及Silverlight的開發成本都相對較低。因為可以避免遭遇Ajax的除錯不易,及瀏覽器支援不一等問題。再與以桌面為基礎的RIA方案比較,Flash/Flex及Silverlight的程式較為輕巧,而且程式不必安裝在用戶端,所以沒有部署與維護版本的負擔。

評估點2:工具整合性

事實上,Flash/Flex與Silverlight的架構大同小異,只是應用的語言不同。

Flash/Flex的開發,背後是由許多套件組成,Flash/Flex的視覺設計工具Creative Suite包含繪圖用的Illustrator、照片處理的Photoshop、網頁設計的Dreamweaver、動畫設計的Flash,以及針對開發者推出的Flex Builder……等,是分工細膩的套件。

而互動介面設計的部分,美術設計師可運用Flash或者Flex Builder,擺放按鈕、文字框,或者定義陣列、Web Services及資料繫結(data binding)的元件等,產生MXML描述語言。而程式邏輯的部分,例如點擊(Click)按鈕觸發的事件(Event),則是以ActionScript語言撰寫。

對照Adobe的Flash/Flex,微軟以執行環境為基礎的RIA解決方案,在定義上很單一,從解決方案的名稱、瀏覽器外掛的執行環境,到程式開發的基礎架構,都稱之為「Silverlight」。

而工具的分類上,對照Adobe的Creative Suite,微軟也有一套視覺設計工具──Expression Studio,其中動畫及介面設計的部分,是透過Expression Blend完成,產生的描述語言稱為XAML。關於需要程式判斷及觸發事件的部分,則交由程式設計師在Visual Studio中以C#或Visual Basic處理。

評估點3:發展速度

微軟推出Silverlight至今一年多,平心而論,進步是飛快的。

Silverlight的執行環境持續追趕Flash Player。Flash Player 10支援原生3D特效及硬體加速,微軟預計下一版就會跟上。

但在設計工具方面,Expression Suite還有很大的進步空間,畢竟Adobe自Macromedia時代發展至今,深耕設計領域已有11、12年的歷史。

微軟與Adobe的RIA解決方案經常被拿來相提並論,臺灣微軟開發工具暨平臺推廣處資深應用架構技術經理李匡正特別強調:「微軟研發Silverlight的目的,是針對自家雲端應用的需要,無意與Adobe競爭。」

2008年10月的PDC(Professional Developers Conference)大會中,微軟已經展示Silverlight技術開發的雲端版全功能Office產品──Office Web Application,預計後續還會有更多以Silverlight實作展示層雲端應用出現。

因應雲端應用的需求,微軟表示,目前將致力於強化Silverlight的「基礎建設」,而非設計工具。因此,可以預期Silverlight執行環境支援的功能,將持續翻新,而且改版的頻率,一年2至3次不足為奇。

評估點4:社群規模

由於微軟於Silverlight 2時,將前端的互動程式語言由JavaScript改為C#及Visual Basic,也就是說,採用微軟開發技術的企業,儼然成為Silverlight的潛在用戶。

換句話說,廣大的.NET族群,運用既有的技能就可以跨入Silverlight的世界,需要額外了解的,只有視覺動畫設計工具Expression Blend及使用者介面描述語言XAML,所以沒有太大的學習門檻。

Flash的設計人才很多,但熟悉Flex前端互動程式語言ActionScript的開發者,難敵.NET族群的數量,不過聯銓資訊先後了接觸Flex及Silverlight,根據總經理林健勝的說法:「物件導向化的ActionScript 3.0,語法與架構極為類似C#,所以熟悉物件導向的開發者,學習ActionScript的門檻並不高。」

反倒是原先ActionScript 1.0及2.0的開發者,升級到3.0會有陣痛期。米蘭數位設計互動技術部經理曾盈學即表示:「我們大約花了半年的時間,適應物件導向化的ActionScript 3.0。」

Silverlight的另一項優勢,在於它可以延用WCF、LINQ等.NET的重要技術,對於需要存取後端資料庫的伺服器等級應用系統,這有很大的益處。

反觀Flash/Flex ,優勢除了設計工具的成熟與完整性,還包括美術設計領域的人才濟濟。相較於開發族群,美術設計人員向來熟稔介面及互動設計,而且他們從養成教育開始,接觸的工具就是Adobe的產品,面對微軟的工具,需要適應期。

再者,微軟的Expression Studio的成熟度,相較於Adobe的Creative Suite,還有很長一段路要走。就以視覺動畫設計工具Expression Blend為例,設計概念仍偏向開發者的操作思維,對於美術設計人員而言不夠友善。

其他如Expression Blend目前提供的控制項,及可以設定的屬性和事件都不算多,而且開發者無法在Visual Studio中調整頁面及元件的編排。

若比較網路社群的資源,微軟目前努力扶植的silverlight.net社群,是處於起步的階段。聯銓資訊在嘗試Flash/Flex及Silverlight兩種技術時,對此有很深的感受,他們在Web搜尋RIA技術的解答,十之八九是Flash/Flex的範例。

評估點5:跨平臺

RIA另一個吸引人的特性,是只要執行環境可以安裝的裝置,應用程式就在上面執行。比如目前Silverlight可以安裝在IE、FireFox及Apple的Safari,甚至Google的Chrome等瀏覽器,所以破除了作業系統的限制,成為.NET的一項跨平臺技術。而Flash/Flex除了跨瀏覽器、作業系統,也支援許多手機的作業平臺,不久的將來,甚至可能在家電上運行。

執行手持裝置的RIA應用有兩種方式。利用瀏覽器是比較簡單的途徑,只要瀏覽器下載及安裝Silverlight或者Flash Player,就能夠執行RIA程式。另一個途徑是裝置本身內建執行環境,開發者可以設定在程式中判斷連線的裝置,提供適合的程式版本及資訊量。

微軟方面預計在2009年第一季,公開測試 Windows Mobile版本的 Silverlight。而Adobe既有的Mobile Client 1.1及Flash Lite等技術,其實已能支援較低階裝置和手機的應用,不過Flash Player只支援到第8版,ActionScript目前也只到2.0版,礙於手機的性能,所以功能及效果有限。

至於高階手機市場,Adobe已於2008年11月與消費性電子晶片商ARM達成協議,宣布未來ARM的晶片將支援Flash 10及AIR,預計2009年第二季就會推出。也就是說,未來將有很大比例的手機,內建Flash引擎,甚至連相機或者冰箱等家電的面板,都可能以Flash/Flex開發操作介面。

評估點6:應用範圍

Flash/Flex與Silverlight各有優勢,企業該如何選擇呢?事實上,如果是內部應用,選Silverlight、Flash/Flex,或者Ajax都無所謂。因為企業可以強制訂出政策,規定開發人員採用的技術、工具及使用環境,所以情況單純很多。

不過,現階段招募.NET人才較容易,因此,目前採用微軟解決方案的企業,如果想嚐試RIA技術開發應用系統,選擇以Silverlight練兵的機率較高。

如果短期內沒有導入RIA的計畫,知名網站FunP的總經理邱繼弘建議:「其實可以從Ajax開始著手,強化Web系統的友善性。例如資訊分頁、AutoComplete,以及欄位之間的連動,都是Ajax可以做到。」

內部應用Ajax,不需要考量複雜的安全性問題,而且可以指定瀏覽器版本,就輕鬆避過瀏覽器對於Ajax支援不一的問題。

但是針對外部應用,邱繼弘明確指出FunP選擇Flash的原因:「普及率。」精誠資訊多媒體產品處知識產品事業部產品經理宋志峰也認為:「這跟技術無關,因為取決點是使用者而非企業。執行環境的普及率是選擇關鍵。」

對於Silverlight普及率如何擴大的問題,李匡正倒是不特別擔心,他表示:「微軟搭配自家網站的各項應用,會引導使用者安裝Silverlight。」

至於未來哪一家的RIA解決方案會在市場上勝出,各界都在觀望。不過兩陣營持續地「觀摩與學習」對方的長處,間接促使並帶動RIA應用的成長,對於Web使用者而言,是正向的發展。

桌面應用:AIR與WPF大不同

談到Silverlight及Flash/Flex,許多人會聯想到WPF及AIR。事實上,WPF及AIR是Silverlight與Flash/Flex的桌面延伸,但若拿WPF和AIR兩者比較,其實並不對等。

AIR是Flash/Flex的桌面延伸

Adobe AIR是Adobe整合Flash、PDF及HTML的決方案。就Adobe內部的定義,Flash Player是Web端呈現互動介面的執行環境;而Acrobat Reader則是桌面端呈現線上或離線文件的展示工具。

Acrobat Reader在9.0版時已支援Flash。所以對桌面應用而言,它其實已經包辦大部分的工作。但Adobe解決方案顧問李彥璋分析:「Reader後期像是瀏覽器,不是應用軟體,使用者可以在PDF中填寫表單,但不會期待複雜的應用系統功能。」

AIR則是完整平臺的結構,它包含Flash、HTML引擎,並提供獨立的API,可以開發存取本機檔案及資料庫、網路偵測及系統更新等機制。

相較於執行於Web端的Flash/Flex,AIR能做的事更多。目前國外已有多個AIR的應用案例,最常為人稱道的是eBay Desktop。使用者下載該軟體,就可以在桌面端瀏覽eBay網站的拍賣資訊,相較於eBay網站,eBay Desktop可以離線瀏覽,並提供更即時的資訊,而且拍賣資訊可以儲存在本機,不用擔心隱私曝光的問題。

AIR最簡單的應用,就是將Flash/Flex延伸到本機,只要電腦裝有AIR的執行環境,原本受限於Web的Flash,就可以在本機執行。對於企業而言,應用的可能性更為廣泛。

這部分,微軟目前暫時沒有對應的解決方案,Silverlight程式無法於桌面端執行。不過,李匡正表示:「微軟不排除Silverlight朝桌面發展的可能性。」

WPF比AIR更接近桌面應用程式

WPF的應用,本機端必須安裝.NET Framework,相較於AIR約15MB的執行環境,上百MB的.NET Framework龐大很多,所以李匡正認為WPF其實已經非常接近桌面應用程式。

雖然WPF也可以開發Web應用程式,但概念上類似Click Once或Java領域的Java Web Start──使用者必須下載WPF程式,應用本機的.NET Framework執行。

採用WPF的好處,除了可以設計酷炫、直覺、結合影音及3D效果的使用介面,而且.NET支援版本檢查的機制,可以在系統啟動時,自動與伺服器比對並更新程式版本。

不過,.NET Framework 3.0的普及率,是WPF普及與否的關鍵指標。

現階段只有Vista作業系統內建.NET Framework 3.0。而Windows XP以下的作業系統,則需要額外下載安裝。

聯銓資訊總經理林健勝曾經評估產品搭配WPF的可行性,他表示:「企業內部仍有很多電腦是Windows 95/98的作業系統,安裝Windows XP的電腦也得考量硬體效能,所以現階段導入WPF的門檻還是很高。」可見WPF應用的成熟度,得視Windows Vista的普及率而定。

 Flash與Flex的差異,在設計的思維 

許多人認為Adobe的企業RIA解決方案,應稱作「Flex」而非「Flash」,因為企業應用重視資料的存取而非動畫。宋志峰強調:「Flash 與Flex 沒有區分的必要,因為兩者在編譯之後都是S W F 檔,也同樣在Flash Player中執行。」

事實上,兩者的差異主要在工具設計概念的不同。Flash CS4主要以動作場景與時間軸的設計概念,安排元件的互動關係;而Flex包括Flex SDK,以及付費的IDE工具Flex Builder。其中Flex Builder是基於Eclipse平臺的開發工具。

Flash的特性不代表它只能用來做動畫,米蘭數位科技互動技術部經理曾盈學解釋:「Flash 適合做動畫,但若美術設計師會寫程式,也可以在Flash中撰寫程式;而開發者運用Flex Builder ,同樣可以透過程式設計動畫的效果。」

所以Flash和Flex的主要差別,是順應美術設計師及開發者的思維不同, 因此Adobe 依角色的特性,推出適合不同族群使用的工具。

 微軟與Adobe的RIA技術規格比較表 

微軟Silverlight 的研發能量,集中在執行環境功能的強化,3D及硬體加速是下一版的重點,而支援行動裝置,則是雙方2009年一致努力的方向。

資料來源:iThome整理,2009 年2 月

 根據用戶端不同性質,展現各式RIA解決方案的差異 

根據研究機構Forrester的分類,RIA 分為以瀏覽器為基礎(Browser Based)、以執行環境為基礎(Player Based)及以桌面為基礎(Desktop Based)等3種解決方案。Ajax屬於以瀏覽器為基礎的RIA;Adobe Flash/Flex及微軟Silverlight屬於以執行環境為基礎的RIA;Adobe AIR或昇陽的JavaFX則是以桌面為基礎的RIA;而微軟的WPF則已經非常貼近桌面應用程式。

【相關報導請參考「宅經濟來臨,RIA網站應用趁勢起飛」專題】

熱門新聞

Advertisement