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

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

[[125175]]

“在做Blend框架中我們會遇到許多問題。對于這些問題，我們的解決方案是降級和增強(qiáng)，這是兩個不同的設(shè)備或者是要匹配兩個不同的目標(biāo)時，我們采用的方案。”張?jiān)瑹樥f。

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

Blend其實(shí)是HybridApp的方案，張?jiān)瑹樅退膱F(tuán)隊(duì)之所以要造它，是因?yàn)楝F(xiàn)有的HybridAPP方案在性能上解決不了問題，他們希望能夠有一個提高性能，有融合能力的HybridAPP解決方案。

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

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

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

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

這是張?jiān)瑹樅退膱F(tuán)隊(duì)進(jìn)行Blend開發(fā)時的基本思路，有了思路，那么應(yīng)該怎么做這個架構(gòu)?總的來說，Blend會支持三個平臺，一個是iOS，一個是安卓，還有一個就是瀏覽器。

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

打造原生應(yīng)用體驗(yàn) Clouda+為直達(dá)號提供“引擎”

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

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

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

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

“Blend由BlendUI和BlendAPI兩部分組成。主要解決了webapp的兩大難題，UI交互不流暢和無法調(diào)用設(shè)備能力。”張?jiān)瑹樈忉尩馈?/p>

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

移動端交互流暢，體驗(yàn)無異于NativeApp。BlendAPI則讓W(xué)ebApp擁有移動設(shè)備的原生能力和百度云服務(wù)能力。