手機App的開發(fā)一般都需要滿足Android和iOS兩個系統(tǒng)環(huán)境,也就意味著一個App需要定制兩套實現方案,造成開發(fā)成本和維護成本都很高。為了解決這個問題,最好的辦法就是實現一套代碼跨端運行,所以Hybrid App混合應用模式應運而生。在Hybrid App整個開發(fā)框架上,有各種各樣的框架,各種各樣的技術選型,而現在主要的技術就是Web技術,不僅簡單,更容易實現UI,開發(fā)者人數也比較多。目前市面上的大多數App都是采用Web+Native的混合技術來實現的。
大型項目開發(fā)所面對的依賴管理、溝通成本問題,也出現在App開發(fā)的過程中,如果不解決好這兩個問題,很可能會引起項目缺陷增多、開發(fā)效率降低,進而導致項目延期,并且也會造成項目后期維護的難度增大。
綜上,對于中大型的App開發(fā)項目,需要一個既支持混合開發(fā)模式、又能夠解決依賴和溝通問題的開發(fā)框架來有效的指導和規(guī)范開發(fā)。
核心需求;
一個好的App開發(fā)框架,要能在框架層面解決中大型App開發(fā)中Hybrid開發(fā)框架選型、模塊間解耦的問題,同時也要提供模塊動態(tài)變更、動態(tài)升級的解決方案。
除了手機App的開發(fā)發(fā)框架之外,還應包括以下三部分內容:
后臺發(fā)布管理平臺
支持模塊動態(tài)變更、動態(tài)升級,后臺發(fā)布管理平臺是與之想配套的后臺管理功能,包括數據管理和App接口兩部分。
持續(xù)集成方案
提供配套的持續(xù)集成方案,用于項目開發(fā)過程中自動打包。
H5模塊開發(fā)規(guī)范
提供H5模塊開發(fā)的規(guī)范,用于實現動態(tài)模塊功能。
解決“規(guī)模變大”問題思路
分而治之
模塊化,將業(yè)務功能劃分成多個獨立的模塊;
模塊間做到高內聚低耦合,互不干擾、并行開發(fā)
依賴統(tǒng)一管理
依賴不可避免;
對依賴進行統(tǒng)一規(guī)劃管理;
模塊間的依賴可以歸納為:
頁面間跳轉
API調用
解決“跨平臺”問題思路
Cordova (PhoneGap)
業(yè)界最主流的開源移動跨端框架
HTML + CSS + JS +原生插件
開放式的原生插件框架
強大的社區(qū)力量
解決“動態(tài)升級”問題思路
App發(fā)布到應用市場后,往往需要一個比較長的審核周期,特別是蘋果商店;當App的重要功能出現Bug時,需要有快速的應對方案,重新發(fā)版本到應用市場肯定是慢了。為了快速的應對業(yè)務需求的變化和緊急Bug的處理,App對動態(tài)升級的需求越來越頻繁。所以實現一套動態(tài)升級方案,主要以模塊為單位展開。
從動態(tài)模塊的角度,將模塊分為三種:NA模塊、H5-offline模塊、H5-online模塊。
NA模塊的頁面都需要預置在App中,H5-offline模塊的頁面可以預置在應用中、也可以在應用安裝后再下載,H5-online模塊的頁面部署在服務器端。
模塊的動態(tài)性主要體現有以下幾方面:
1、模塊的icon、名字可以動態(tài)修改;
2、模塊的三種類型之間可以互相切換,比如:某個模塊本來是NA實現,上線后發(fā)現有重大Bug,可以切換到H5-offine或者H5-online的實現,如果沒有這兩種實現,可以切換到一個“敬請期待”的在線頁面;
3、H5-offline模塊支持版本升級。
對于模塊動態(tài)升級,主要指的是H5-offline模塊,對H5-offline模塊的安全性要做充分的考慮:對模塊的離線包有進行加密處理,也要對離線包里的文件進行哈希校驗,防止被篡改。
技術架構
App開發(fā)框架應以模塊化設計為基礎,同時打通NA與H5兩種不同技術實現的業(yè)務。模塊主要分為兩種形態(tài):
NA模塊
主要由NA頁面組成,也可以是NA容器加載的H5頁面,NA模塊可以對外提供api;
H5模塊
由H5頁面組成,可以是離線頁面也可以是在線頁面,H5模塊無法對外提供api,但是可以調用其他NA模塊提供的api;
實現模塊間的完全解耦,推薦模塊代碼不僅要邏輯上獨立,最好是采用子工程的方式實現物理上的分離。通過三條總線機制來實現模塊間的解耦:
API總線
主要提供模塊api注冊和調用兩個能力;
頁面導航總線
不區(qū)分NA和H5的融合頁面設計,頁面的打開和返回由頁面導航總線統(tǒng)一調度;
模塊總線
模塊總線從邏輯上確定了模塊的概念,同時支持模塊的遠程變更和動態(tài)升級;
采用業(yè)界最流行的Cordova框架來充當JS Bridge,Cordova擁有大量的社區(qū)插件可以使用,同時也提供了完整的插件開發(fā)規(guī)范,非常容易自定義開發(fā)插件。
開發(fā)框架應對API總線、頁面導航總線、模塊總線這些核心能力提供了cordova插件的實現,使H5頁面也能夠輕松的調用這些api,并且做到NA與H5調用無差異化。
開發(fā)框架發(fā)布件
App開發(fā)框架庫:
framework(android&ios)
plugins(js)
App工程Demo(android&ios)
server:
發(fā)布管理平臺的部署包、接口文檔、部署手冊等文件
產品白皮書:
對開發(fā)框架的使用進行詳細的講解
開發(fā)框架集成
使用Cordova命令行創(chuàng)建項目工程;
向工程中導入開發(fā)框架庫framework(android&ios);
為主工程和子工程創(chuàng)建開發(fā)框架統(tǒng)一約定的配置文件;
在App啟動的時候調用開發(fā)框架的初始化方法,進行初始化;
集成完畢,可以在項目中正常使用開發(fā)框架的API
開發(fā)框架配置文件
在使用開發(fā)框架前,需要將api、page、module注冊到開發(fā)框架對應的總線中,除了調用對應的注冊外,開發(fā)框架推薦采用配置文件的注冊方式,只需要將數據配在配置文件中,開發(fā)框架會自動完成注冊。
開發(fā)框架的配置文件的命名約定為:開發(fā)框架名稱-子工程名.xml,其中主工程為開發(fā)框架名稱-main.xml,配置文件的約定放置的位置為:
Android放在主工程和子工程的assets的根目錄下;
iOS放在主工程和子工程的bundle文件中。
模塊總線主要有兩方面的功能:
在邏輯上,以模塊為基礎在開發(fā)框架配置文件中組織頁面和API,使得邏輯更清晰;
在功能上,模塊總線主要實現動態(tài)模塊的功能,對外提供兩個核心的API類:
ModuleBus提供模塊的原子化操作方法;
ModuleHelper封裝了ModuleBus提供的原子方法,實現了業(yè)務的串聯(lián),是一個快捷使用API的輔助類
注:模塊總線將模塊的狀態(tài)分為:正常、未安裝、有新版本(分強制升級和非強制升級)、已下載、模塊數據被篡改。
開發(fā)框架頁面導航總線
主要功能:
對NA頁面和H5頁面的跳轉進行統(tǒng)一的調度,通過維護一個頁面的棧來實現。
核心API:
開發(fā)框架頁面API總線
API總線主要的作用是解耦模塊間的方法調用,提供的核心API只有兩個:
register
模塊實現API后,向總線注冊(一般由框架在解析配置文件時自動調用);
call
調用API,調用方通過API總線調用需要調用的API
使用舉例
登錄成功后,賬戶模塊保存登錄token,其他的模塊需要獲取token時,要調用賬戶模塊提供的API獲取。實現步驟如下:
1、賬戶模塊實現GetTokenAPI,調用APIBus.register(“m_account”, “getToken”,GetTokenAPI.class)注冊到API總線;
2、A模塊需要獲取token時,調用APIBus.call(“m_account”, “getToken”,“入參”)獲取token,返回值是APIResult對象(
對象主要包含狀態(tài)碼和業(yè)務字符串)。
開發(fā)框架擴展
提供模塊級別的開發(fā)框架:
NA模塊提供MVC、MVP、MVVM等開發(fā)框架;
H5模塊提供MVVM、SPA等開發(fā)框架;
H5模塊提供微信的兼容支持
跨平臺App開發(fā)框架比較;
每個框架幾乎都包含以下特性:
使用 HTML5 + CSS + JavaScript 開發(fā)
跨平臺重用代碼
豐富的UI庫
提供訪問設備原生API的 JavaScript API 包裝器
解決原生開發(fā)中機型適配的難題
提供打包、部署的工具或服務
都需要學習自身封裝的 JavaScript API
篩選框架的要求:
性能:運行速度快
UI:提供接近原生的UI體驗
插件多,文檔豐富,開發(fā)效率高,容易擴展和維護
滿足業(yè)務需求
1,Cordova
Cordova 和 PhoneGap 的區(qū)別?
PhoneGap 是 Apache Cordova 的一個分發(fā)版,就像 Ubuntu 是 基于 Linux 的一個發(fā)行版,其代碼庫也基于 Cordova,只是 PhoneGap 關聯(lián)了 Adobe 的一些額外的商業(yè)工具或服務,例如 PhoneGap Build 和 Adobe Shadow,來幫助開發(fā)者簡化開發(fā)。
此外,兩者提供的CLI工具、項目結構有差異,如:
Cordova 把 config.html 放在項目目錄下,而 PhoneGap 把它放在www 目錄下。
優(yōu)點:
開源免費,社區(qū)生態(tài)成熟,插件豐富
支持離線場景應用
開發(fā)工具選擇空間大
缺點:
只提供基礎訪問設備的接口,需要自己搭配其他UI框架和JavaScript框架來搭配
UI框架
Framework7
MSUI | Github
Famous
為任意屏幕創(chuàng)建流暢、復雜的UI。
免費和開源的JavaScript渲染引擎。著名引擎的獨特之處在于其JavaScript渲染引擎和3D物理引擎。
官網 | Github | Hello World
使用 Famo.us 創(chuàng)建高性能移動 UI
2,Ionic
官網地址:http://www.ionic.wang/ (有案例)
Ionic = Cordova + AngularJS + 一套樣式庫。
技術要求
HTML + CSS + AngularJS
優(yōu)點:
基于 Cordova
漂亮的界面,追求性能,專注原生,免費開源
Angular JS MVVM 開發(fā)理念,數據雙向綁定
繼承自 Cordova,可以使用 Cordova 的插件
缺點:
Angular JS 學習路線陡峭
Ionic 框架相比于原生的 Cordova 有所差異,Cordova 某些官方插件可能不適用于Ionic
3,AppCan
通過AppCan IDE集成開發(fā)系統(tǒng)、云端打包器等,快速開發(fā)出Android、iOS、WP平臺上的移動應用。
有兩種方式創(chuàng)建項目:IDE 和云端,并且IDE可以同步到云端。
免費用戶有100M空間、50個應用的限制。
優(yōu)點
提供一體化解決方案,方便環(huán)境搭建、開發(fā)、調試、發(fā)布
框架自帶UI包,包含常用控件樣式
框架對UI、動畫渲染進行過優(yōu)化,反應速度快
支持本地打包、云端打包
基于密鑰的代碼加密
缺點
不開源,無法修改、優(yōu)化底層代碼
分大眾版和企業(yè)版,大眾版免費,但功能有缺失,詳細見附錄
暫不支持自行開發(fā)控件/,無法調取android原生功能
框架自帶功能過多,導致應用安裝包偏大。
文檔偏少
部分系統(tǒng)無法使用IDE進行調試
只能在服務器端發(fā)布,無法在本地發(fā)布
IOS發(fā)布,需要將證書上傳至服務器
4,APICloud
優(yōu)點:
不懂原生開發(fā),不懂后臺語言就可完成
APP缺點:
更新速度快,版本不夠穩(wěn)定
面向不懂App開發(fā)人群,不適合程序員和科技公司,過度依賴會降低技術水平
涉嫌抄襲DCloud大量代碼
5,React Native
能夠在Javascript和React的基礎上獲得完全一致的開發(fā)體驗,構建世界的原生
APP。
僅需學習一次,編寫任何平臺。(Learn once, write anywhere)
缺點:
初次學習成本高
必須在不同平臺下寫兩套代碼,依賴暴露的接口
文章名稱:手機APP開發(fā)框架的選擇
標題來源:http://www.rwnh.cn/news/144238.html
網站建設、網絡推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網站制作,網絡營銷seo公司;服務項目有App開發(fā)等
廣告
聲明:本網站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源:
創(chuàng)新互聯(lián)