基於Html5的移動端APP開發框架

   快速增長的APP應用軟件市場,以及智能手機的普及,手機應用:Native(原生)APP快速佔領了APP市場,成爲了APP開發的主流,但其平臺的不通用性,開發成本高,多版本開發等問題,一直困擾着專業APP開發企業,和APP服務提供商。 安卓和IOS的操作方式,開發模式,界面UI顯示方面的差別,也使得原生APP的不同版本體驗有很大的區別,光是做兼容性調測,都要花費開發企業不少的時間。

   近年來,另一種應用形態——基於HTML5技術的Web App也如雨後春筍般出現,於是關於原生APP與HTML5 APP 誰將成爲未來的王者,APP開發者們一直爭論不休。

html5最主要的優勢: 
1、一套HTML5 APP 即可同時適用安卓及IOS平臺,甚至WP平臺,適配性和統一體驗較好。
  2、版本服務器端更新,用戶永遠看到的都是最新的APP端信息。
  3、手機客戶端及存儲數據較少,節約用戶手機空間
  4、技術難度較低,開發工作量小,開發成本低。
 **侷限性:**
 用戶體驗大幅落後於原生APP,操作的流暢度,程序的執行效率,與原生APP都有較大差距;HTML5 APP 受網速的影響較大,在網絡情況較差的情況下,HTML5 APP 往往連打開都困難,而原生程序,基本都能順利打開運行(只是速度較慢)。

 因公司項目需求,近端時間研究html5 app開發框架,發現有很多,查資料總結下。

介紹那些app適合html5開發:http://www.educity.cn/wenda/11971.html

1.框架:PhoneGap
官網:http://phonegap.com/
簡介: PhoneGap是一個用基於HTML,CSS和JavaScript的,創建移動跨平臺移動應用程序的快速開發平臺。它使開發者能夠利用iPhone,Android,Palm,Symbian,WP7,WP8,Bada和Blackberry智能手機的核心功能——包括地理定位,加速器,聯繫人,聲音和振動等,此外PhoneGap擁有豐富的插件,可以調用。
優點:1.可跨平臺。phonegap框架幫我們解決了差異性,javascript與平臺系統的連接由phonegap框架完成。成爲連接移動終端的適配器,或者說中間件。
2.提供硬件訪問控制。可調用加速計、攝像頭、羅盤、通訊錄、文檔、地理定位、媒體、網絡、通知(警告、聲音和振動)、存儲。
3.可利用成熟javascript框架。如:Ext js、jQuery。
缺點:1.性能差。運行速度慢,UI反應延時——這是個致命傷。(高端機影響不大)
2.不能完全跨平臺。不同平臺代碼需要微調。
3.內存消耗大。
4.調試難度大。

2.框架:Ionic
官網:http://ionicframework.com/
簡介: Ionic 是一個強大的 HTML5 應用程序開發框架,號稱 Advanced HTML5 Hybrid Mobile AppFramework 是 AngularJS 移動端解決方案 可以幫助您使用 Web 技術,比如 HTML、 CSS 和Javascript 構建接近原生體驗的移動應用程序。 Ionic 主要關注外觀和體驗,以及和你的應用程序的 UI 交互,特別適合用於基於 Hybird 模式的 HTML5 移動應用程序開發。 Ionic 是一個輕量的手機 UI 庫,具有速度快,界面現代化、美觀等特點。爲了解決其他一些UI 庫在手機上運行緩慢的問題。
優點:1.追求性能 運行速度快
2.輕量級框架
3.基於 Angularjs,支持 Angularjs的特性, MVC ,代碼易維護
4.通過 SASS 構建應用程序。它提供了很多 UI 組件來幫助開發者開發強大的應用。
5.接近原生。
6.強大的命令行工具
3.可利用成熟javascript框架。如:Ext js、jQuery。
缺點:1.Ionic是一個前段框架。不能完全取代PhoneGap和JavaScript框架的作用
2.需要結合插件使用。

3.框架:Hbuilder(國產)
官網:http://dcloud.io/
簡介: HBuilder是DCloud推出一款支持HTML5的Web開發IDE。“快,是HBuilder的最大優勢,通過完整的語法提示和代碼輸入法、代碼塊及很多配套,HBuilder能大幅提升HTML、js、css的開發效率。
優點:1、HTML5語法、HTML5+語法、三大瀏覽器擴展語法,盡收HBuilder中。
2、每個瀏覽器發佈新版後,一週內,其新增語法就收錄入HBuilder。
3、強大到令你震驚的Jquery語法提示!
4、每個語法在哪個瀏覽器、哪個版本上是否可運行,這裏都有。
5、沒有比這裏更全的語法庫,也沒有比這裏更全的瀏覽器兼容性數據庫。
缺點:1.雲端編譯,無法保證安全性。
2.不能完全跨平臺。不同平臺代碼需要微調。

4.框架:appcan(國產)
官網:http://www.appcan.cn/
簡介:AppCan是國內Hybrid App混合模式開發的倡導者,AppCan應用引擎支持Hybrid App的開發和運行。並且着重解決了基於HTML5的移動應用”不流暢”和”體驗差”的問題。使用AppCan應用引擎提供的Native交互能力,可以讓HTML5開發的移動應用基本接近Native App的體驗。
與Phonegap支持單一webview使用div爲單位開發移動應用不同。AppCan支持多窗口機制,讓開發者可以像最傳統的網頁開發一樣,通過頁面鏈接的方式靈活的開發移動應用。基於這種機制,開發者可以開發出大型的移動應用,而不是隻能開發簡易類型的移動應用。
AppCan提供強大的設備調用能力,電話、短信、相機、LBS、傳感器、數據庫等常用的手機功能,開發者可以通過JS接口調用,輕鬆構建移動應用。
優點:1.跨平臺:同時支持iOS、Android、Symbian、Windows Phone
2.原生體驗:引入原生UI控件與交互支持(如Action Sheet等)
3.開發工具:基於Eclipse的開發工具,集成UI控件與應用管理
4.UI框架:提供強大的UI框架,更加易於實現頁面佈局與交互
5.設備API:支持各種手機設備調用,如電話、相機、傳感器、定位等
6.本地打包:無需配置環境,無需編譯,本地一鍵打包
7.插件機制:支持第三方原生插件,支持JS插件
8.代碼加密:基於密鑰的加密方式,無法破解,像混編一樣保護html代碼
統計分析:應用分平臺安裝數統計,應用啓動和使用情況統計
9.開放平臺:更具本土優勢,已經對接Sina、QQ、百度等開放平臺
10.技術支持:技術支持及時響應,重視開發者建議和反饋
缺點:1.AppCan免費版因需要把源代碼上傳到廠商的服務器上打包,對於企業開發來說源代碼泄露安全性上有一定風險。企業版雖然可以解決,但企業版穩定尚待觀察。
2.AppCan採用封裝的組件,依賴性比較高。不是開源代碼。
3.AppCan 不能很好的解決原生代碼的功能。

5.框架:Wex5(國產)
官網:http://wex5.com/
簡介:WeX5應用快速開發框架(含完整的SDK API及全部源碼),一次開發、跨端運行。
【定位】開發面向消費者和公衆的開放應用系統
【適用】一般app、電商app、客服app、會員app、微店微商等
【前端】安卓app/蘋果app/微信服務號/PC web app
【後端】後端數據處理組件,對接各主流技術平臺
【費用】完全開源,徹底免費,無任何限制
優點:1.高效精緻的UI組件體系,基於jquery和bootstrap技術,採用增強的RequireJS模塊化技術。
2.基於phonegap(cordova)框架,如相機、地圖、LBS定位、指南針、通訊錄、文件、語音、電池等。
3.可視化拖拽式集成開發環境IDE,全能力的調試支持和智能代碼提示
缺點:1.使用範圍有限:適用:一般app、電商app、客服app、會員app、微店微商等
2.用戶量小,存在不穩定因素。

6.框架:ApiCloud(國產)
官網:http://www.apicloud.com/
簡介:APICloud是中國領先的“雲端一體”的移動應用雲服務提供商。APICloud推行“雲端一體”的理念,重新定義了移動應用開發。APICloud爲開發者從“雲”和“端”兩個方向提供API,簡化移動應用開發技術,讓移動應用的開發週期從一個月縮短到7天。APICloud由“雲API”和“端API”兩部分組成,可以幫助開發者快速實現移動應用的開發、測試、發佈、管理和運營的全生命週期管理。
APICloud致力成爲中國領先的移動垂直領域雲服務商,幫助傳統軟件公司從B/S架構成功走向APP,幫助中國數百萬web開發者轉化成移動APP專家!。
優點:1.提供開發的IDE。
2.提供數據雲API、統計雲API、推送雲API
缺點:與Hbuilder存在版權問題,抄襲Hbuilder

7、JQuery Mobile
1.官方網站:http://jquerymobile.com/
2.性質:UI框架
3.說明:這個大名鼎鼎的JQuery的移動版本。跟JQuery一樣是一個輕量級的JS庫,一樣使用HTML5+CSS+JS的技術。應爲輕量級,所以在web加載時比Sencha有一點優勢。缺點顯而易見,UI控件太少了。因爲JQuery Mobile 太普及了,也有很多第三方的擴展控件庫例如JQuery Mobile Touch。比較有意思的是Sencha Touch 也融合了JQuery Mobile Touch。
4.授權:完全開源,放心使用

不同的開發框架有不同的優缺點,使用哪個還需要根據需求針對性的選用

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章