WebAPP在開發(fā)效率上與NativeApp相比有著天然的優(yōu)勢，但是在體驗上卻有著較大的差距。移動互聯(lián)網(wǎng)時代如何實現(xiàn)優(yōu)勢互補，將Native能力融入到WebAPP中，是業(yè)界一直在探討的話題。本期百度技術(shù)沙龍，加入百度已經(jīng)6年的資深前端張袁煒為大家?guī)砹酥黝}為《融入原生能力到WebApp》的技術(shù)分享，主要講解了Blend架構(gòu)對于WebApp的優(yōu)化問題。

據(jù)悉，本期百度技術(shù)沙龍是今年的***一期，作為國內(nèi)最早的技術(shù)交流活動，百度技術(shù)沙龍即將迎來自己的第5個年頭，如今百度技術(shù)沙龍已經(jīng)被北京甚至全國的技術(shù)愛好者視為不可或缺的技術(shù)學習家園。

[[125175]]

“在做Blend框架中我們會遇到許多問題。對于這些問題，我們的解決方案是降級和增強，這是兩個不同的設(shè)備或者是要匹配兩個不同的目標時，我們采用的方案。”張袁煒說。

Blend開源 用一整套方案使WebApp流暢起來

Blend其實是HybridApp的方案，張袁煒和他的團隊之所以要造它，是因為現(xiàn)有的HybridAPP方案在性能上解決不了問題，他們希望能夠有一個提高性能，有融合能力的HybridAPP解決方案。

在張袁煒看來，WebApp最大的優(yōu)勢在于迭代速度。移動互聯(lián)網(wǎng)時代，以WebApp為主角的HTML5開發(fā)方案的迭代速度很快，它是隨時可以更新的，因為它每次用戶訪問，如果不走緩存，它就會到服務器上獲取最新的數(shù)據(jù)。而無論是安卓還是iOS的Native App一個發(fā)版的周期平均下來大概是十四天，這會嚴重影響迭代速度。

張袁煒表示：“天下武功唯快不破，大家知道移動互聯(lián)網(wǎng)時代，一個公司或者一個產(chǎn)品想要成功，有可能它的時間要求是天級別的。如果你一個產(chǎn)品晚上線一天機會就錯失了，也就是說我們要盡可能加快迭代速度。”

作為正在做的應用開發(fā)框架，Blend不僅僅是一項“拿來即用”的開源技術(shù)，更是一種開發(fā)理念。使用這個理念，App不僅能保留web靈活性，剔除冗長的版本發(fā)布過程，做到極快的迭代速度，還能在交互中保證足夠的流暢性。

這樣的實現(xiàn)結(jié)果說起來容易，可張袁煒團隊剛剛開始架構(gòu)Blend時，著實費了一番功夫。他們首先針對WebApp的性能、能力、易用性三個大方面開始了整套架構(gòu)方案的研發(fā)。在經(jīng)歷了一段時間的摸索之后，張袁煒發(fā)現(xiàn)了一套比較合理的架構(gòu)方案：在Web交互中，用原生的Web實現(xiàn)的時候，非常卡的東西用Native來實現(xiàn)，其他所有的交互和所有的開發(fā)都用純Web語言來降低開發(fā)成本。

這是張袁煒和他的團隊進行Blend開發(fā)時的基本思路，有了思路，那么應該怎么做這個架構(gòu)?總的來說，Blend會支持三個平臺，一個是iOS，一個是安卓，還有一個就是瀏覽器。

在iOS或者是安卓端，張袁煒和他的團隊在上面開發(fā)一個Runtime，把原生的能力通過js的封裝，把它的接口暴露出來給上面的js或者是頁面調(diào)用同時，他們也開發(fā)了很多JsAPI給開發(fā)者使用。“首先是端能力，這個更像應用調(diào)起，你要調(diào)起微信或者是百度搜索，我們還具有本地文件的能力;第二個是云能力，這里面包括百度的服務，帳號的服務和支付;第三個是UI能力，我們有轉(zhuǎn)場動畫等等，還有手勢跟隨，還會用Native組件。”張袁煒介紹道。

打造原生應用體驗 Clouda+為直達號提供“引擎”

“Blend能在能保證用戶體驗的前提下節(jié)省人力成本，又有很高的定制性，迭代速度和web相當，對我們編程開發(fā)的幫助很大。”在現(xiàn)場的討論環(huán)節(jié)，一位聽眾表示。

在現(xiàn)場，張袁煒還為聽眾們列舉了不少案例。他介紹，開源的Blend技術(shù)糅合了WebApp和NativeApp各自的優(yōu)勢，結(jié)合百度強大的云能力，可以為直達號和WebApp開發(fā)和部署提供有力支持。

作為Clouda+的重要做成部分，Blend為移動web應用開發(fā)提供了整體解決方案，最近火爆網(wǎng)絡(luò)的百度直達號正是因為有了Clouda+，才能做到用戶體驗極佳，體驗和交互媲美Native應用。

具體來說，Blend是一套JavaScript的API，將Native的端能力和百度的云服務融合(Blend)到WebApp中。

“Blend由BlendUI和BlendAPI兩部分組成。主要解決了webapp的兩大難題，UI交互不流暢和無法調(diào)用設(shè)備能力。”張袁煒解釋道。

BlendUI讓Javascript擁有操作Webview和Native控件的能力，讓web

移動端交互流暢，體驗無異于NativeApp。BlendAPI則讓WebApp擁有移動設(shè)備的原生能力和百度云服務能力。