手機(jī)App的開(kāi)發(fā)一般都需要滿足Android和iOS兩個(gè)系統(tǒng)環(huán)境，也就意味著一個(gè)App需要定制兩套實(shí)現(xiàn)方案，造成開(kāi)發(fā)成本和維護(hù)成本都很高。為了解決這個(gè)問(wèn)題，最好的辦法就是實(shí)現(xiàn)一套代碼跨端運(yùn)行，所以Hybrid App混合應(yīng)用模式應(yīng)運(yùn)而生。在Hybrid App整個(gè)開(kāi)發(fā)框架上，有各種各樣的框架，各種各樣的技術(shù)選型，而現(xiàn)在主要的技術(shù)就是Web技術(shù)，不僅簡(jiǎn)單，更容易實(shí)現(xiàn)UI，開(kāi)發(fā)者人數(shù)也比較多。目前市面上的大多數(shù)App都是采用Web+Native的混合技術(shù)來(lái)實(shí)現(xiàn)的。

大型項(xiàng)目開(kāi)發(fā)所面對(duì)的依賴管理、溝通成本問(wèn)題，也出現(xiàn)在App開(kāi)發(fā)的過(guò)程中，如果不解決好這兩個(gè)問(wèn)題，很可能會(huì)引起項(xiàng)目缺陷增多、開(kāi)發(fā)效率降低，進(jìn)而導(dǎo)致項(xiàng)目延期，并且也會(huì)造成項(xiàng)目后期維護(hù)的難度增大。
綜上，對(duì)于中大型的App開(kāi)發(fā)項(xiàng)目，需要一個(gè)既支持混合開(kāi)發(fā)模式、又能夠解決依賴和溝通問(wèn)題的開(kāi)發(fā)框架來(lái)有效的指導(dǎo)和規(guī)范開(kāi)發(fā)。
核心需求；
一個(gè)好的App開(kāi)發(fā)框架，要能在框架層面解決中大型App開(kāi)發(fā)中Hybrid開(kāi)發(fā)框架選型、模塊間解耦的問(wèn)題，同時(shí)也要提供模塊動(dòng)態(tài)變更、動(dòng)態(tài)升級(jí)的解決方案。
除了手機(jī)App的開(kāi)發(fā)發(fā)框架之外，還應(yīng)包括以下三部分內(nèi)容：
后臺(tái)發(fā)布管理平臺(tái)
支持模塊動(dòng)態(tài)變更、動(dòng)態(tài)升級(jí)，后臺(tái)發(fā)布管理平臺(tái)是與之想配套的后臺(tái)管理功能，包括數(shù)據(jù)管理和App接口兩部分。
持續(xù)集成方案
提供配套的持續(xù)集成方案，用于項(xiàng)目開(kāi)發(fā)過(guò)程中自動(dòng)打包。
H5模塊開(kāi)發(fā)規(guī)范
提供H5模塊開(kāi)發(fā)的規(guī)范，用于實(shí)現(xiàn)動(dòng)態(tài)模塊功能。
解決“規(guī)模變大”問(wèn)題思路
分而治之
模塊化，將業(yè)務(wù)功能劃分成多個(gè)獨(dú)立的模塊；
模塊間做到高內(nèi)聚低耦合，互不干擾、并行開(kāi)發(fā)
依賴統(tǒng)一管理
依賴不可避免；
對(duì)依賴進(jìn)行統(tǒng)一規(guī)劃管理；
模塊間的依賴可以歸納為：
頁(yè)面間跳轉(zhuǎn)
API調(diào)用
解決“跨平臺(tái)”問(wèn)題思路
Cordova (PhoneGap)
業(yè)界最主流的開(kāi)源移動(dòng)跨端框架
HTML + CSS + JS +原生插件
開(kāi)放式的原生插件框架
強(qiáng)大的社區(qū)力量
解決“動(dòng)態(tài)升級(jí)”問(wèn)題思路
App發(fā)布到應(yīng)用市場(chǎng)后，往往需要一個(gè)比較長(zhǎng)的審核周期，特別是蘋果商店；當(dāng)App的重要功能出現(xiàn)Bug時(shí)，需要有快速的應(yīng)對(duì)方案，重新發(fā)版本到應(yīng)用市場(chǎng)肯定是慢了。為了快速的應(yīng)對(duì)業(yè)務(wù)需求的變化和緊急Bug的處理，App對(duì)動(dòng)態(tài)升級(jí)的需求越來(lái)越頻繁。所以實(shí)現(xiàn)一套動(dòng)態(tài)升級(jí)方案，主要以模塊為單位展開(kāi)。
從動(dòng)態(tài)模塊的角度，將模塊分為三種：NA模塊、H5-offline模塊、H5-online模塊。
NA模塊的頁(yè)面都需要預(yù)置在App中，H5-offline模塊的頁(yè)面可以預(yù)置在應(yīng)用中、也可以在應(yīng)用安裝后再下載，H5-online模塊的頁(yè)面部署在服務(wù)器端。
模塊的動(dòng)態(tài)性主要體現(xiàn)有以下幾方面：
1、模塊的icon、名字可以動(dòng)態(tài)修改；
2、模塊的三種類型之間可以互相切換，比如：某個(gè)模塊本來(lái)是NA實(shí)現(xiàn)，上線后發(fā)現(xiàn)有重大Bug，可以切換到H5-offine或者H5-online的實(shí)現(xiàn)，如果沒(méi)有這兩種實(shí)現(xiàn)，可以切換到一個(gè)“敬請(qǐng)期待”的在線頁(yè)面；
3、H5-offline模塊支持版本升級(jí)。
對(duì)于模塊動(dòng)態(tài)升級(jí)，主要指的是H5-offline模塊，對(duì)H5-offline模塊的安全性要做充分的考慮：對(duì)模塊的離線包有進(jìn)行加密處理，也要對(duì)離線包里的文件進(jìn)行哈希校驗(yàn)，防止被篡改。
技術(shù)架構(gòu)
App開(kāi)發(fā)框架應(yīng)以模塊化設(shè)計(jì)為基礎(chǔ)，同時(shí)打通NA與H5兩種不同技術(shù)實(shí)現(xiàn)的業(yè)務(wù)。模塊主要分為兩種形態(tài)：
NA模塊
主要由NA頁(yè)面組成，也可以是NA容器加載的H5頁(yè)面，NA模塊可以對(duì)外提供api；
H5模塊
由H5頁(yè)面組成，可以是離線頁(yè)面也可以是在線頁(yè)面，H5模塊無(wú)法對(duì)外提供api，但是可以調(diào)用其他NA模塊提供的api；
實(shí)現(xiàn)模塊間的完全解耦，推薦模塊代碼不僅要邏輯上獨(dú)立，最好是采用子工程的方式實(shí)現(xiàn)物理上的分離。通過(guò)三條總線機(jī)制來(lái)實(shí)現(xiàn)模塊間的解耦：
API總線
主要提供模塊api注冊(cè)和調(diào)用兩個(gè)能力；
頁(yè)面導(dǎo)航總線
不區(qū)分NA和H5的融合頁(yè)面設(shè)計(jì)，頁(yè)面的打開(kāi)和返回由頁(yè)面導(dǎo)航總線統(tǒng)一調(diào)度；
模塊總線
模塊總線從邏輯上確定了模塊的概念，同時(shí)支持模塊的遠(yuǎn)程變更和動(dòng)態(tài)升級(jí)；
采用業(yè)界最流行的Cordova框架來(lái)充當(dāng)JS Bridge，Cordova擁有大量的社區(qū)插件可以使用，同時(shí)也提供了完整的插件開(kāi)發(fā)規(guī)范，非常容易自定義開(kāi)發(fā)插件。
開(kāi)發(fā)框架應(yīng)對(duì)API總線、頁(yè)面導(dǎo)航總線、模塊總線這些核心能力提供了cordova插件的實(shí)現(xiàn)，使H5頁(yè)面也能夠輕松的調(diào)用這些api，并且做到NA與H5調(diào)用無(wú)差異化。

開(kāi)發(fā)框架發(fā)布件
App開(kāi)發(fā)框架庫(kù)：
framework（android&ios）
plugins（js）
App工程Demo（android&ios）
server：
發(fā)布管理平臺(tái)的部署包、接口文檔、部署手冊(cè)等文件
產(chǎn)品白皮書：
對(duì)開(kāi)發(fā)框架的使用進(jìn)行詳細(xì)的講解
開(kāi)發(fā)框架集成
使用Cordova命令行創(chuàng)建項(xiàng)目工程；
向工程中導(dǎo)入開(kāi)發(fā)框架庫(kù)framework（android&ios）；
為主工程和子工程創(chuàng)建開(kāi)發(fā)框架統(tǒng)一約定的配置文件；
在App啟動(dòng)的時(shí)候調(diào)用開(kāi)發(fā)框架的初始化方法，進(jìn)行初始化；
集成完畢，可以在項(xiàng)目中正常使用開(kāi)發(fā)框架的API
開(kāi)發(fā)框架配置文件
在使用開(kāi)發(fā)框架前，需要將api、page、module注冊(cè)到開(kāi)發(fā)框架對(duì)應(yīng)的總線中，除了調(diào)用對(duì)應(yīng)的注冊(cè)外，開(kāi)發(fā)框架推薦采用配置文件的注冊(cè)方式，只需要將數(shù)據(jù)配在配置文件中，開(kāi)發(fā)框架會(huì)自動(dòng)完成注冊(cè)。
開(kāi)發(fā)框架的配置文件的命名約定為：開(kāi)發(fā)框架名稱-子工程名.xml，其中主工程為開(kāi)發(fā)框架名稱-main.xml，配置文件的約定放置的位置為：
Android放在主工程和子工程的assets的根目錄下；
iOS放在主工程和子工程的bundle文件中。
模塊總線主要有兩方面的功能：
在邏輯上，以模塊為基礎(chǔ)在開(kāi)發(fā)框架配置文件中組織頁(yè)面和API，使得邏輯更清晰；
在功能上，模塊總線主要實(shí)現(xiàn)動(dòng)態(tài)模塊的功能，對(duì)外提供兩個(gè)核心的API類：
ModuleBus提供模塊的原子化操作方法；
ModuleHelper封裝了ModuleBus提供的原子方法，實(shí)現(xiàn)了業(yè)務(wù)的串聯(lián)，是一個(gè)快捷使用API的輔助類
注：模塊總線將模塊的狀態(tài)分為：正常、未安裝、有新版本（分強(qiáng)制升級(jí)和非強(qiáng)制升級(jí)）、已下載、模塊數(shù)據(jù)被篡改。
開(kāi)發(fā)框架頁(yè)面導(dǎo)航總線
主要功能：
對(duì)NA頁(yè)面和H5頁(yè)面的跳轉(zhuǎn)進(jìn)行統(tǒng)一的調(diào)度，通過(guò)維護(hù)一個(gè)頁(yè)面的棧來(lái)實(shí)現(xiàn)。
核心API：
開(kāi)發(fā)框架頁(yè)面API總線
API總線主要的作用是解耦模塊間的方法調(diào)用，提供的核心API只有兩個(gè)：
register
模塊實(shí)現(xiàn)API后，向總線注冊(cè)(一般由框架在解析配置文件時(shí)自動(dòng)調(diào)用)；
call
調(diào)用API，調(diào)用方通過(guò)API總線調(diào)用需要調(diào)用的API
使用舉例
登錄成功后，賬戶模塊保存登錄token，其他的模塊需要獲取token時(shí)，要調(diào)用賬戶模塊提供的API獲取。實(shí)現(xiàn)步驟如下：
1、賬戶模塊實(shí)現(xiàn)GetTokenAPI，調(diào)用APIBus.register(“m_account”, “getToken”,GetTokenAPI.class)注冊(cè)到API總線；
2、A模塊需要獲取token時(shí)，調(diào)用APIBus.call(“m_account”, “getToken”,“入?yún)ⅰ?獲取token，返回值是APIResult對(duì)象(
對(duì)象主要包含狀態(tài)碼和業(yè)務(wù)字符串)。
開(kāi)發(fā)框架擴(kuò)展
提供模塊級(jí)別的開(kāi)發(fā)框架：
NA模塊提供MVC、MVP、MVVM等開(kāi)發(fā)框架；
H5模塊提供MVVM、SPA等開(kāi)發(fā)框架；
H5模塊提供微信的兼容支持
跨平臺(tái)App開(kāi)發(fā)框架比較；
每個(gè)框架幾乎都包含以下特性：
使用 HTML5 + CSS + JavaScript 開(kāi)發(fā)
跨平臺(tái)重用代碼
豐富的UI庫(kù)
提供訪問(wèn)設(shè)備原生API的 JavaScript API 包裝器
解決原生開(kāi)發(fā)中機(jī)型適配的難題
提供打包、部署的工具或服務(wù)
都需要學(xué)習(xí)自身封裝的 JavaScript API
篩選框架的要求：
性能：運(yùn)行速度快
UI：提供接近原生的UI體驗(yàn)
插件多，文檔豐富，開(kāi)發(fā)效率高，容易擴(kuò)展和維護(hù)
滿足業(yè)務(wù)需求
1，Cordova
Cordova 和 PhoneGap 的區(qū)別？
PhoneGap 是 Apache Cordova 的一個(gè)分發(fā)版，就像 Ubuntu 是 基于 Linux 的一個(gè)發(fā)行版，其代碼庫(kù)也基于 Cordova，只是 PhoneGap 關(guān)聯(lián)了 Adobe 的一些額外的商業(yè)工具或服務(wù)，例如 PhoneGap Build 和 Adobe Shadow，來(lái)幫助開(kāi)發(fā)者簡(jiǎn)化開(kāi)發(fā)。
此外，兩者提供的CLI工具、項(xiàng)目結(jié)構(gòu)有差異，如：
Cordova 把 config.html 放在項(xiàng)目目錄下，而 PhoneGap 把它放在www 目錄下。
優(yōu)點(diǎn)：
開(kāi)源免費(fèi)，社區(qū)生態(tài)成熟，插件豐富
支持離線場(chǎng)景應(yīng)用
開(kāi)發(fā)工具選擇空間大
缺點(diǎn):
只提供基礎(chǔ)訪問(wèn)設(shè)備的接口，需要自己搭配其他UI框架和JavaScript框架來(lái)搭配
UI框架
Framework7
MSUI | Github
Famous
為任意屏幕創(chuàng)建流暢、復(fù)雜的UI。
免費(fèi)和開(kāi)源的JavaScript渲染引擎。著名引擎的獨(dú)特之處在于其JavaScript渲染引擎和3D物理引擎。
官網(wǎng) | Github | Hello World
使用 Famo.us 創(chuàng)建高性能移動(dòng) UI
2，Ionic
官網(wǎng)地址：http://www.ionic.wang/ （有案例）
Ionic = Cordova + AngularJS + 一套樣式庫(kù)。
技術(shù)要求
HTML + CSS + AngularJS
優(yōu)點(diǎn)：
基于 Cordova
漂亮的界面，追求性能，專注原生，免費(fèi)開(kāi)源
Angular JS MVVM 開(kāi)發(fā)理念，數(shù)據(jù)雙向綁定
繼承自 Cordova，可以使用 Cordova 的插件
缺點(diǎn)：
Angular JS 學(xué)習(xí)路線陡峭
Ionic 框架相比于原生的 Cordova 有所差異，Cordova 某些官方插件可能不適用于Ionic
3，AppCan
通過(guò)AppCan IDE集成開(kāi)發(fā)系統(tǒng)、云端打包器等，快速開(kāi)發(fā)出Android、iOS、WP平臺(tái)上的移動(dòng)應(yīng)用。
有兩種方式創(chuàng)建項(xiàng)目：IDE 和云端，并且IDE可以同步到云端。
免費(fèi)用戶有100M空間、50個(gè)應(yīng)用的限制。
優(yōu)點(diǎn)
提供一體化解決方案，方便環(huán)境搭建、開(kāi)發(fā)、調(diào)試、發(fā)布
框架自帶UI包，包含常用控件樣式
框架對(duì)UI、動(dòng)畫渲染進(jìn)行過(guò)優(yōu)化，反應(yīng)速度快
支持本地打包、云端打包
基于密鑰的代碼加密
缺點(diǎn)
不開(kāi)源，無(wú)法修改、優(yōu)化底層代碼
分大眾版和企業(yè)版，大眾版免費(fèi)，但功能有缺失，詳細(xì)見(jiàn)附錄
暫不支持自行開(kāi)發(fā)控件/，無(wú)法調(diào)取android原生功能
框架自帶功能過(guò)多，導(dǎo)致應(yīng)用安裝包偏大。
文檔偏少
部分系統(tǒng)無(wú)法使用IDE進(jìn)行調(diào)試
只能在服務(wù)器端發(fā)布，無(wú)法在本地發(fā)布
IOS發(fā)布，需要將證書上傳至服務(wù)器
4，APICloud
優(yōu)點(diǎn)：
不懂原生開(kāi)發(fā)，不懂后臺(tái)語(yǔ)言就可完成APP
缺點(diǎn)：
更新速度快，版本不夠穩(wěn)定
面向不懂App開(kāi)發(fā)人群，不適合程序員和科技公司，過(guò)度依賴會(huì)降低技術(shù)水平
涉嫌抄襲DCloud大量代碼
5，React Native
能夠在Javascript和React的基礎(chǔ)上獲得完全一致的開(kāi)發(fā)體驗(yàn)，構(gòu)建世界的原生APP。
僅需學(xué)習(xí)一次，編寫任何平臺(tái)。(Learn once, write anywhere)
缺點(diǎn)：
初次學(xué)習(xí)成本高
必須在不同平臺(tái)下寫兩套代碼，依賴暴露的接口

文章題目：手機(jī)APP開(kāi)發(fā)框架的選擇
URL網(wǎng)址：http://www.rwnh.cn/news38/144238.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián)，是專注品牌與效果的網(wǎng)站制作，網(wǎng)絡(luò)營(yíng)銷seo公司；服務(wù)項(xiàng)目有App開(kāi)發(fā)等

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)