移動(dòng)端混合開發(fā)框架分析

-.z移動(dòng)端架構(gòu)分析目錄TOC\o"1-4"\h\z\u移動(dòng)端架構(gòu)分析11移動(dòng)端常見開發(fā)模式21.1純NativeApp2主流框架2優(yōu)勢(shì)2劣勢(shì)2主流應(yīng)用21.2HybridApp2多View混合型2主流框架2優(yōu)勢(shì)2劣勢(shì)2主流應(yīng)用2開展趨勢(shì)2主體型2主流框架平臺(tái)2優(yōu)勢(shì)2劣勢(shì)2主流應(yīng)用2開展趨勢(shì)2單View混合型2主流框架2優(yōu)勢(shì)2劣勢(shì)2主流應(yīng)用21.3WebApp2主流框架2優(yōu)勢(shì)2劣勢(shì)2主流應(yīng)用21.4四種主要開發(fā)模式比照22移動(dòng)前端主流框架分析22.1Web和Native混合22.1.1WindVane+Hybrid+Native2簡(jiǎn)介2框架實(shí)現(xiàn)2架構(gòu)圖22簡(jiǎn)介2框架實(shí)現(xiàn)2架構(gòu)圖22.2跨平臺(tái)原生應(yīng)用22簡(jiǎn)介2框架實(shí)現(xiàn)2架構(gòu)圖22.2.2NativeScript2簡(jiǎn)介2框架實(shí)現(xiàn)2構(gòu)造圖22.2.3ReactNative2簡(jiǎn)介2框架實(shí)現(xiàn)2架構(gòu)圖23數(shù)夢(mèng)移動(dòng)端開發(fā)框架選擇錯(cuò)誤！未定義書簽。3.1開發(fā)模式選擇2為什么不選擇Native2玩什么不選擇WebApp或Web主體型Hybird2選擇多頁面混合型Hybird23.2選擇類WindVane框架2玩什么不選擇ReactNative2玩什么選擇類WindVane框架2移動(dòng)端常見開發(fā)模式目前主流應(yīng)用程序大體分為三類：NativeApp、HybridApp、WebApp。純NativeAppNativeAPP指的是使用原生程式編寫運(yùn)行的第三方應(yīng)用程序，一般依托于操作系統(tǒng)如iOS、Android、WP，有很強(qiáng)的交互，是一個(gè)完整的App，可拓展性強(qiáng)。需要用戶下載安裝使用。也叫本地app。NativeApp因?yàn)槲挥谄脚_(tái)層上方，向下訪問和兼容的能力會(huì)比較好一些，可以支持在線或離線，消息推送或本地資源訪問，攝像撥號(hào)功能的調(diào)取。但是由于設(shè)備碎片化，App的開發(fā)本錢要高很多，維持多個(gè)版本的更新升級(jí)比較麻煩，用戶的安裝門檻也比較高。但是比較樂觀的是，AppStore培養(yǎng)了一種比較好的用戶付費(fèi)模式，所以在Apple的生態(tài)圈里，開發(fā)者的盈利模式是一種明朗狀態(tài)，其他market也在往這條路上靠攏。主流框架iOS：〔1〕、Cocoa環(huán)境+Foundation和UIKit框架〔2〕、使用Objective-C和Swift做為主要開發(fā)語言〔兼容C/C++〕Android：〔1〕、Java虛擬機(jī)環(huán)境〔2〕、使用Java作為主要開發(fā)語言〔支持C/C++〕WindowsPhone：〔1〕、WindowsRunTime框架〔WP10〕〔2〕、使用原生C++、C*和Silverlight做為主要開發(fā)語言優(yōu)勢(shì)〔1〕、打造完美的用戶體驗(yàn)〔2〕、性能穩(wěn)定〔3〕、操作速度快，上手流暢〔4〕、訪問本地資源〔通訊錄，相冊(cè)〕〔5〕、設(shè)計(jì)出色的動(dòng)效，轉(zhuǎn)場(chǎng)〔6〕、擁有系統(tǒng)級(jí)別的貼心通知或提醒〔7〕、用戶留存率高劣勢(shì)〔1〕、開發(fā)本錢高，可移植性差，需要維護(hù)iOS、Android、WP等多個(gè)平臺(tái)〔不同平臺(tái)有不同的開發(fā)語言和界面適配〕〔2〕、維護(hù)本錢高〔例如一款A(yù)pp已更新至V5版本，但仍有用戶在使用V2，V3，V4版本，需要更多的開發(fā)人員維護(hù)之前的版本〕〔3〕、更新緩慢，根據(jù)不同平臺(tái)，提交–審核–上線等等不同的流程，需要經(jīng)過的流程較復(fù)雜主流應(yīng)用夠快云庫、微信本、美圖秀秀等中量級(jí)應(yīng)用。HybridAppHybridAPP指的是半原生半Web的混合類App。需要下載安裝，局部頁面看上去類似NativeApp，但只有很少的UIWebView，訪問的內(nèi)容是Web。HybridApp主要以JS+Native兩者相互調(diào)用為主，從開發(fā)層面實(shí)現(xiàn)“一次開發(fā)，多處運(yùn)行〞的機(jī)制，成為真正適合跨平臺(tái)的開發(fā)。HybridApp同時(shí)使用網(wǎng)頁語言與程序語言開發(fā)，通過應(yīng)用商店區(qū)分移動(dòng)操作系統(tǒng)分發(fā)，用戶需要安裝使用的移動(dòng)應(yīng)用?？傮w特性更接近NativeApp但是和WebApp區(qū)別較大。只是因?yàn)橥瑫r(shí)使用了網(wǎng)頁語言編碼，所以開發(fā)本錢和難度比NativeApp要小很多。因此說，HybridApp兼具了NativeApp的所有優(yōu)勢(shì)，也兼具了WebApp使用HTML5跨平臺(tái)開發(fā)低本錢的優(yōu)勢(shì)。HybridApp按網(wǎng)頁語言與程序語言的混合，通常分為三種類型：多View混合型，單View混合型，Web主體型。多View混合型即NativeView和WebView獨(dú)立展示，NativeView與WebView交替的場(chǎng)景出現(xiàn)。這種應(yīng)用混合邏輯相對(duì)簡(jiǎn)單。即在需要的時(shí)候，將WebView當(dāng)成一個(gè)獨(dú)立的View(Activity)運(yùn)行起來，在WebView內(nèi)完成相關(guān)的展示操作。這種移動(dòng)應(yīng)用主體通常是NativeApp，Web技術(shù)只是起到補(bǔ)充作用。開發(fā)難度和NativeApp根本相當(dāng)。主流框架Native局部使用操作系統(tǒng)原生框架+JSBridge。Web融合局部國內(nèi)阿里系使用最廣的框架WindVane+HybridAPI等〔后續(xù)章節(jié)詳細(xì)介紹〕。優(yōu)勢(shì)〔1〕、高效、擴(kuò)展性強(qiáng)、支持多團(tuán)隊(duì)并行開發(fā)〔2〕、銜接Android/iOS原生導(dǎo)航交互，完美的用戶體驗(yàn)〔3〕、業(yè)務(wù)實(shí)現(xiàn)更靈活，復(fù)雜業(yè)務(wù)可通過Native實(shí)現(xiàn)，頻繁變化或簡(jiǎn)單業(yè)務(wù)通過Web實(shí)現(xiàn)，更好的滿足移動(dòng)端業(yè)務(wù)多樣性、快速迭代要求〔4〕、輕量級(jí)的框架，框架侵入性弱，各個(gè)業(yè)務(wù)高度獨(dú)立，第三方業(yè)務(wù)快速接入〔5〕、使用JSBridge來實(shí)現(xiàn)HTML5頁面與原生框架的數(shù)據(jù)交互：JS<->Native，性能和平安性更佳〔6〕、擴(kuò)展豐富，能實(shí)現(xiàn)超級(jí)App劣勢(shì)〔1〕、技術(shù)要求高，需要開發(fā)人員同時(shí)懂Native和WebApp開發(fā)〔2〕、重量級(jí)架構(gòu)，架構(gòu)搭建需要較長時(shí)間〔3〕、開源社區(qū)相關(guān)框架少，成熟框架如WindVane等不開源主流應(yīng)用目前使用最常用的開發(fā)模式，市場(chǎng)上能見到的超級(jí)App根本都是用這種開發(fā)模式，如微信、支付寶、淘寶等；其他如釘釘、新聞客戶端等移動(dòng)端App開展趨勢(shì)2021-2021最新開展趨勢(shì)，同時(shí)在Web和Native融合的根底上參加ReactNative或NativeScript等跨平臺(tái)構(gòu)建原生應(yīng)用框架〔見后續(xù)介紹〕。Web主體型即移動(dòng)應(yīng)用的主體是WebView，主要以網(wǎng)頁語言編寫，穿插Native功能的HybridApp開發(fā)類型。這種類型開發(fā)的移動(dòng)應(yīng)用體驗(yàn)相對(duì)而言存在缺陷，但整體開發(fā)難度大幅降低，并且根本可以實(shí)現(xiàn)跨平臺(tái)。Web主體型的移動(dòng)應(yīng)用用戶體驗(yàn)的好壞，主要取決于底層中間件的交互與跨平臺(tái)的能力。國外的appMobi、PhoneGap和國內(nèi)的We*5、AppCan和Re*see都屬于Web主體型移動(dòng)應(yīng)用中間件。其中Re*see不支持跨平臺(tái)開發(fā)。appMobi和PhoneGap除根底的底層能力更多是通過插件〔Plugins〕擴(kuò)展的機(jī)制實(shí)現(xiàn)Hybrid。AppCan除了插件機(jī)制，還提供了大量的單View混合型的接口來完善和彌補(bǔ)Web主體型HybridApp體驗(yàn)差的問題，接近NativeApp的體驗(yàn)。而We*5則在揉合PhoneGap和Bootstrap等主流技術(shù)的根底上，對(duì)性能進(jìn)一步做了深度優(yōu)化，不但完全具備NativeApp對(duì)本地資源的調(diào)用能力，性能體驗(yàn)也不輸原生；We*5所開發(fā)出來的app具備完全的跨端運(yùn)行能力，可以無需任何修改直接運(yùn)行在各種前端環(huán)境上。主流框架平臺(tái)1、AppceleratorAppcelerator的Titanium開發(fā)平臺(tái)使開發(fā)者可以通過HTML、PHP、JavaScript、Ruby、Python等Web編程語言開發(fā)手機(jī)、平板和桌面的原生App。其優(yōu)勢(shì)在于它可以讓用戶輕松地訪問超過300個(gè)API以及定位信息。此外，Appcelerator提供針對(duì)特定行為或事件定制的統(tǒng)計(jì)。App的數(shù)據(jù)既可儲(chǔ)存在云端，也可儲(chǔ)存在設(shè)備上。2、APICloudAPICloud是一款“云端一體〞的移動(dòng)開發(fā)平臺(tái)，信仰“云端一體〞的理念，重新定義了移動(dòng)應(yīng)用開發(fā)。APICloud為開發(fā)者從“云〞和“端〞兩個(gè)方向提供API，簡(jiǎn)化移動(dòng)應(yīng)用開發(fā)技術(shù)，讓移動(dòng)應(yīng)用的開發(fā)周期從一個(gè)月縮短到7天。APICloud由“云API〞和“端API〞兩局部組成，可以幫助開發(fā)者快速實(shí)現(xiàn)移動(dòng)應(yīng)用的開發(fā)、測(cè)試、發(fā)布、管理和運(yùn)營的全生命周期管理。3、PhoneGapPhoneGap是一個(gè)免費(fèi)且開源的開發(fā)環(huán)境，使開發(fā)者可以開發(fā)出在Android、Palm、黑莓、iPhone、iTouch及iPad等設(shè)備上運(yùn)行的App。其使用的是HTML和JavaScript等標(biāo)準(zhǔn)的Web開發(fā)語言。開發(fā)者使用PhoneGap進(jìn)展開發(fā)，可調(diào)用加速計(jì)、GPS/定位、照相機(jī)、聲音等功能。PhoneGap還提供AdobeAIRApp以及在線的培訓(xùn)課程，幫助開發(fā)者了解原生API并在他們自己的平臺(tái)上開發(fā)移動(dòng)App。4、KinveyKinvey同樣是一個(gè)為移動(dòng)應(yīng)用開發(fā)者提供后臺(tái)創(chuàng)立效勞的平臺(tái)。Kinvey強(qiáng)調(diào)加速移動(dòng)應(yīng)用開發(fā)與銷售的“即取即用〞理念。Kinvey的中間層與數(shù)據(jù)層均托管在多個(gè)云效勞提供商處，包括Rackspace、Amazon與Microsoft。所有通過Kinvey存儲(chǔ)的數(shù)據(jù)都會(huì)有四種方式備份：AmazonEC2、WindowsAzure、Rackspace以及Kinvey自己的效勞器，假設(shè)其中一兩個(gè)出現(xiàn)了故障，用戶的數(shù)據(jù)依然安然無恙。5、E*MobiE*Mobi通過全面的數(shù)據(jù)集成技術(shù)和豐富的跨平臺(tái)客戶端展現(xiàn)能力，將業(yè)務(wù)系統(tǒng)快速、平安、高效的移植于移動(dòng)終端。E*Mobi從開發(fā)〔IDE環(huán)境〕、集成〔IT系統(tǒng)對(duì)接、云效勞〕、打包〔各個(gè)操作系統(tǒng)的應(yīng)用打包〕、發(fā)布〔應(yīng)用的運(yùn)行〕、管理〔日志管理，更新管理〕上提供了一套完整的解決方案。并通過專業(yè)的培訓(xùn)和支撐渠道為開發(fā)者提供可持續(xù)的學(xué)習(xí)和交流空間，掃除開發(fā)障礙。優(yōu)勢(shì)〔1〕、可跨平臺(tái)，兼容iOS、Android、WP等多個(gè)平臺(tái)〔2〕、易用性，會(huì)Web開發(fā)即可轉(zhuǎn)型App開發(fā)〔3〕、可利用成熟javascript框架〔4〕、程序升級(jí)簡(jiǎn)單〔5〕、維護(hù)難度低劣勢(shì)〔1〕、運(yùn)行速度慢〔2〕、不適合局部程序，如復(fù)雜的動(dòng)畫、3D功能、音頻視頻以及復(fù)雜的界面邏輯等〔3〕、調(diào)用平臺(tái)資源差，功能受限平臺(tái)實(shí)現(xiàn)〔4〕、資源占用大，如內(nèi)存、CPU、網(wǎng)絡(luò)帶寬等〔5〕、調(diào)試難度大〔6〕、不利于多人協(xié)作開發(fā)主流應(yīng)用12306客戶端、中國工商銀行客戶端等功能較單一的輕量級(jí)應(yīng)用。開展趨勢(shì)雖然跨平臺(tái)復(fù)用代碼是一個(gè)熾熱的話題，但是基于Html5的PhoneGap等Hybrid框架沒有被大多數(shù)人承受〔運(yùn)行速度慢、交互差是主要原因〕，目前更多的方案是Web和Native多View混合或用各種方法產(chǎn)生原生的UI界面〔如BeeFramework、NativeScript、ReactNative等〕。單View混合型即在同一個(gè)View內(nèi)，同時(shí)包括NativeView和WebView?；ハ嘀g是覆蓋(層疊)的關(guān)系。這種HybridApp的開發(fā)本錢較高，開發(fā)難度較大，但是體驗(yàn)較好。如百度搜索為代表的單View混合型移動(dòng)應(yīng)用，既可以實(shí)現(xiàn)充分的靈活性，又能實(shí)現(xiàn)較好的用戶體驗(yàn)。主流框架根本沒有特別成型的框架，主要為局部App做Web嵌套，完成廣告、宣傳等功能。Native局部同NativeApp。Web局部同WebApp。優(yōu)勢(shì)〔1〕、能解決廣告、宣傳等模塊變化過快問題，滿足市場(chǎng)需求〔2〕、有NativeApp的大局部?jī)?yōu)點(diǎn)劣勢(shì)〔1〕、開發(fā)難度大，Native和Web代碼混合，技術(shù)難度根本等同Native開發(fā)〔2〕、維護(hù)難度大等Native常見的缺點(diǎn)主流應(yīng)用目前純粹使用單View混合型的App較少〔局部App的局部頁面會(huì)用這種開發(fā)模式〕，主要應(yīng)用場(chǎng)景如App中添加廣告、宣傳等。WebAppWebApp指采用Html5語言寫出的App，不需要下載安裝。類似于現(xiàn)在所說的輕應(yīng)用。生存在瀏覽器中的應(yīng)用，根本上可以說是觸屏版的網(wǎng)頁應(yīng)用。主流框架jQueryMobile、AngularJS等。優(yōu)勢(shì)〔1〕開發(fā)本錢低〔2〕更新快〔3〕更新無需通知用戶，不需要手動(dòng)升級(jí)〔4〕能夠跨多個(gè)平臺(tái)和終端劣勢(shì)〔1〕臨時(shí)性的入口〔2〕無法獲取系統(tǒng)級(jí)別的通知，提醒，動(dòng)效等等〔3〕用戶留存率低〔4〕設(shè)計(jì)受限制諸多〔5〕體驗(yàn)較差主流應(yīng)用微信公眾號(hào)/訂閱號(hào)應(yīng)用、支付寶效勞窗應(yīng)用等輕量級(jí)應(yīng)用。四種主要開發(fā)模式比照WebApp網(wǎng)頁應(yīng)用HybridAppWeb主體型HybridApp多View混合型NativeApp原生應(yīng)用開發(fā)本錢低中Native局部本錢高Web局部本錢低高維護(hù)更新簡(jiǎn)單簡(jiǎn)單Native局部復(fù)雜Web局部簡(jiǎn)單復(fù)雜體驗(yàn)差中優(yōu)優(yōu)性能慢慢較快快原生界面模擬模擬局部模擬原生官方市場(chǎng)認(rèn)可不認(rèn)可認(rèn)可認(rèn)可認(rèn)可安裝不需要需要需要需要跨平臺(tái)優(yōu)優(yōu)Web局部跨平臺(tái)優(yōu)差A(yù)pp級(jí)別輕量級(jí)輕量級(jí)超級(jí)App，支持App中嵌套MicroApp重量級(jí)適應(yīng)性一般中，對(duì)復(fù)雜應(yīng)用支持較差優(yōu)一般移動(dòng)前端主流框架分析Web和Native混合WindVane+Hybrid+Native簡(jiǎn)介WindVane是阿里內(nèi)部一種移動(dòng)端Web和Native混合框架，主要為解決多平臺(tái)統(tǒng)一交互體驗(yàn)、動(dòng)態(tài)部署〔插件化〕等問題，降低開發(fā)本錢，提升前端開發(fā)效率。WindVane是對(duì)Native代碼的一種擴(kuò)展，根底效勞仍然以Native代碼為主。框架實(shí)現(xiàn)可定制化UI組件資源本地緩存，資源預(yù)置打包效勞Web與本地功能模塊通信交互Web調(diào)用本地功能的JSBridge通信效勞架構(gòu)圖AppCan簡(jiǎn)介AppCan移動(dòng)應(yīng)用快速開發(fā)平臺(tái)是基于HTML5技術(shù)的跨平臺(tái)快速開發(fā)解決方案,開發(fā)者使用HTML5+CSS3+JavaScript技術(shù)可以快速的開發(fā)與本地應(yīng)用相媲美的移動(dòng)應(yīng)用,同時(shí)支持iOS、Android、Symbian、WindowsPhone四大智能操作系統(tǒng).AppCan-SDK是AppCan平臺(tái)專為開發(fā)者提供的IDE開發(fā)環(huán)境,集成了:1、移動(dòng)UI框架2、手機(jī)設(shè)備API3、調(diào)試模擬器4、離線打包效勞5、應(yīng)用云端管理使移動(dòng)開發(fā)更加方便快捷.與Phonegap支持單一webview使用div為單位開發(fā)移動(dòng)應(yīng)用不同。AppCan支持多窗口機(jī)制，讓開發(fā)者可以像最傳統(tǒng)的網(wǎng)頁開發(fā)一樣，通過頁面的方式靈活的開發(fā)移動(dòng)應(yīng)用?；谶@種機(jī)制，開發(fā)者可以開發(fā)出大型的移動(dòng)應(yīng)用，而不是只能開發(fā)簡(jiǎn)易類型的移動(dòng)應(yīng)用。AppCan提供強(qiáng)大的設(shè)備調(diào)用能力，、短信、相機(jī)、LBS、傳感器、數(shù)據(jù)庫等常用的手機(jī)功能，開發(fā)者可以通過JS接口調(diào)用，輕松構(gòu)建移動(dòng)應(yīng)用。AppCan是Web占主體型Native為輔的開發(fā)框架。框架實(shí)現(xiàn)HTML5：支持HTML5開發(fā)，CSS3實(shí)現(xiàn)布局優(yōu)化及交互提升原生體驗(yàn)：引入局部原生UI控件與交互支持〔如ActionSheet等〕開發(fā)工具：基于Eclipse的開發(fā)工具，集成UI控件與應(yīng)用管理模擬器：提供應(yīng)用全功能模擬器，方便開發(fā)調(diào)試UI框架：提供強(qiáng)大的UI框架，更加易于實(shí)現(xiàn)頁面布局與交互設(shè)備API：支持各種手機(jī)設(shè)備調(diào)用，如、相機(jī)、傳感器、定位等本地打包：無需配置環(huán)境，無需編譯，本地一鍵打包云端打包：提供云端打包效勞，提供更加個(gè)性化的選擇多窗口機(jī)制：常見應(yīng)用只支持單一窗口，多窗口可以有效提高交互體驗(yàn)插件機(jī)制：支持第三方原生插件，支持JS插件支付支持：相比國外中間件更具外鄉(xiāng)優(yōu)勢(shì)，NotPaypalbut'ZhiFuBao'代碼加密：基于密鑰的加密方式，無法破解，像混編一樣保護(hù)html代碼統(tǒng)計(jì)分析：應(yīng)用分平臺(tái)安裝數(shù)統(tǒng)計(jì)，應(yīng)用啟動(dòng)和使用情況統(tǒng)計(jì)開放平臺(tái)：更具外鄉(xiāng)優(yōu)勢(shì)，已經(jīng)對(duì)接Sina、QQ、百度等開放平臺(tái)技術(shù)支持：技術(shù)支持及時(shí)響應(yīng)，重視開發(fā)者建議和反響架構(gòu)圖生態(tài)構(gòu)造：移動(dòng)端框架：跨平臺(tái)原生應(yīng)用BeeFramework簡(jiǎn)介BeeFramework是一款iOS快速開發(fā)框架，允許開發(fā)者使用Objective-C和*ML/CSS來進(jìn)展iPhone和iPad開發(fā)，由GavinKwoe和QFish開發(fā)并維護(hù)。其早期原型曾經(jīng)被應(yīng)用在QQ空間和QQ游戲大廳等多款精品APP中。BeeFramework包含豐富的組件和工具。BeeFramework解決了iOS開發(fā)者長期困擾的各種問題，諸如：分層架構(gòu)如何設(shè)計(jì)，層與層之間消息傳遞與處理，網(wǎng)絡(luò)操作及緩存，異步及多線程，以及適配產(chǎn)品多變的UI布局需求?？蚣軐?shí)現(xiàn)代碼注入借助于OC語言特性，Bee將核心邏輯注入到NSObject基類中去，在使用Bee時(shí)，大多數(shù)情況下可以不必修改現(xiàn)有類繼承關(guān)系，這樣設(shè)計(jì)是把雙刃劍，也有可能與您現(xiàn)有方法名沖突?；贛VC模型典型的MVC架構(gòu)，清楚的分為View、Controller、Model三個(gè)層次，業(yè)務(wù)數(shù)據(jù)、業(yè)務(wù)邏輯、界面展現(xiàn)、交互邏輯完全別離。事件驅(qū)動(dòng)對(duì)于Controller、Model均與狀態(tài)無關(guān)〔Stateless〕，因此由三種Event驅(qū)動(dòng)：Message、Request、Notification。對(duì)于View，我們拋棄掉了老舊的Delegate〔語言級(jí)實(shí)現(xiàn)方式〕，引入新概念UISignal〔框架級(jí)實(shí)現(xiàn)方式〕用來驅(qū)動(dòng)界面交互事件或狀態(tài)改變。UISignalUISignal擁有極強(qiáng)的路由能力，可以在UIView<->UIView<->UIViewController<->UINavigationController<->UIViewController之間完成復(fù)雜且高效的的UI信號(hào)路由。架構(gòu)圖NativeScript簡(jiǎn)介一個(gè)開源的框架，可以使用JavaScript開發(fā)跨平臺(tái)、真正原生的iOS,Android和Windows移動(dòng)App。開發(fā)人員使用NativeScript提供的庫來構(gòu)建應(yīng)用UI，其抽象了各種原生平臺(tái)之間的不同?？蚣軐?shí)現(xiàn)NativeScript運(yùn)行時(shí)NativeScript使用JavaScript虛擬機(jī)，在Android上采用GoogleV8JavaScript引擎，iOS上采用JavaScriptCore引擎。通過JS解析引擎，在JavaScript和原生語言之間的轉(zhuǎn)換，建立跨平臺(tái)橋梁。JavaScript虛擬機(jī)管理V8知道Android是什么〔同理JavaScriptCore也知道iOS是什么〕，因?yàn)镹ativeScript在運(yùn)行時(shí)進(jìn)展了注入，因?yàn)閂8擁有一堆讓你配置JavaScript環(huán)境的API。在JavaScript中您可以使用自定義的C++代碼來分析CPU使用率，管理的JavaScript垃圾收集，等等一大堆API面對(duì)這些API的是幾個(gè)“Conte*t〞類，可以讓你操縱全局變量，從而有可能為NativeScript注入一個(gè)全局的android對(duì)象。這實(shí)際上使用了與Node.js的一樣運(yùn)行機(jī)制，使全局API可用-如require()-NativeScript使用它注入可以讓你訪問本地代碼的API。JavaScriptCore的也有類似的機(jī)制。Metadata〔元數(shù)據(jù)〕對(duì)于NativeScript，反射是讓NativeScript可以調(diào)用每個(gè)平臺(tái)上的API的基石。因?yàn)閺男阅芙嵌葋砜粗貥?gòu)這些API是很困難的，NativeScript會(huì)提前做掉這些，并在Android/iOS預(yù)編繹過程中嵌入預(yù)先生成的元數(shù)據(jù)。調(diào)用本地代碼NativeScript如何調(diào)用本機(jī)代碼的答案就在于JavaScript虛擬機(jī)的API。我們上次使用V8的API是注入全局變量。這一次，我們將著眼于在JavaScript回調(diào)中調(diào)用給定的C++代碼。例如，JavaScript函數(shù)調(diào)用的代碼newandroid.te*t.format.Time()，V8會(huì)產(chǎn)生一個(gè)回調(diào)。也就是說V8有一個(gè)回調(diào)，讓NativeScript攔截函數(shù)調(diào)用，然后用自定義的C++代碼執(zhí)行一些動(dòng)作，并返回一個(gè)新的結(jié)果。在Android中的情況下，NativeScript運(yùn)行的C++代碼不能直接訪問JavaAPI，如。然而，Android的JNI，或Java本地接口，提供了C++和Java之間的橋接能力，所以NativeScript使用JNI完成轉(zhuǎn)發(fā)。在iOS中這個(gè)橋梁是不必要的，因?yàn)镃++代碼可以直接調(diào)用Objective-C的API。構(gòu)造圖ReactNative簡(jiǎn)介ReactNative使你能夠使用基于JavaScript和React一致的開發(fā)體驗(yàn)在本地平臺(tái)上構(gòu)建世界一流的應(yīng)用程序體驗(yàn)。ReactNative把重點(diǎn)放在所有開發(fā)人員關(guān)心的平臺(tái)的開發(fā)效率上——開發(fā)者只需學(xué)習(xí)一種語言就能輕易為任何平臺(tái)高效地編寫代碼。Facebook在多個(gè)應(yīng)用程序產(chǎn)品中使用了ReactNative，并將繼續(xù)為ReactNative投資?？蚣軐?shí)現(xiàn)原生的iOS組件可使用標(biāo)準(zhǔn)平臺(tái)組件，比方iOS平臺(tái)上的UITabBar和UINavigationController。這可以讓你的應(yīng)用程序擁有和原生平臺(tái)一致的外觀和體驗(yàn)，并保持較高的品質(zhì)。使用相應(yīng)的React組件，如iOS標(biāo)簽欄和iOS導(dǎo)航器，這些組件可以輕松并入你的應(yīng)用程序中。異步執(zhí)行JavaScript應(yīng)用代碼和原生平臺(tái)之間所有的操作都是異步執(zhí)行，并且原生模塊也可以使用額外線程。這意味著我們可以解碼主線程圖像，并將其在后臺(tái)保存至磁盤，在不阻塞UI的情況下進(jìn)展文本和布局的估量計(jì)算，等等。因此，ReactNative應(yīng)用程序的流暢度和響應(yīng)性都非常好。通信也是完全可序列化的，當(dāng)運(yùn)行完整的應(yīng)用程序時(shí)，這允許我們使用ChromeDeveloperTools來調(diào)試JavaScript，或者在模擬器中，或者在真機(jī)上。觸摸處理iOS有一個(gè)非常強(qiáng)大的系統(tǒng)稱為ResponderChain，可以用來響應(yīng)復(fù)雜視圖層級(jí)中的事件，但是在Web中并沒有類似功能的工具。ReactNative可實(shí)現(xiàn)類似的響應(yīng)系統(tǒng)并提供高水平的組件，比方TouchableHighlight，無需額外配置即可與滾動(dòng)視圖和其他元素適度整合。彈性框和樣式布局視圖應(yīng)該是簡(jiǎn)單的，所以我們將Web平臺(tái)上的彈性框模塊引入了ReactNative。彈性框可用來搭建最常用的UI布局，比方代用邊緣和填充的堆疊和嵌入。ReactNative還支持常見的Web樣式，比方fontWeight和StyleSheet抽象，它們提供了一種優(yōu)化機(jī)制來宣稱你所有的樣式和布局在組件中的應(yīng)用是正確的，且組件把它們應(yīng)用到了內(nèi)網(wǎng)中。PolyfillsReactNative的重點(diǎn)是改變視圖代碼編寫的方式。接下來，我們注意網(wǎng)絡(luò)中普遍的并把那些API放在適當(dāng)?shù)牡胤健？梢允褂胣pm安裝JavaScript庫，這些庫用于融入到ReactNative中的頂級(jí)功能，比方*MLHttpRequest，window.requestAnimationFrame及navigator.geolocation。我們正在