搭建一個全棧式的HTML5移動應用框架（純乾貨，親！）

  打開HTML5的技術網站，滿屏的「5個推薦的JavaScript框架」、「10個移動應用框架」，全都是你妹的框架，

可是，你知道這些框架是幹毛用的嗎？來吧，咱們來梳理一下吧

 

  目前HTML5涉及的框架大體能夠分紅如下幾類：

  一、跨平臺開發框架：PhoneGap 、 Titanium、 Trigger.IO（商業）

這類框架是向web提供底層硬件的接口，讓開發人員能夠用WEB的技術開發出Native APP。

 

  二、UI框架：jQuery Mobile、 Sencha Touch、 jqMobi

這類框架提供「控件」：佈局、按鈕。。。。。。

 

  三、MVC框架：Backbone.js、 Spine.js、 Ember.js

這類框架提供在javascript端上Model、View分離的技術，由於在one page的狀況下，javascript

控制的邏輯愈來愈複雜，須要作這樣的分離。

 

  四、依賴與加載框架：Require.js、 Sea.js

當咱們要寫一個稍大型的javascript應用的時候，必然會面對不一樣JS文件間的引用，JS的同步、異步

加載等需求，這種框架就是幫咱們解決這樣的問題的。

 

  好，下面咱們挑其中的一些框架來說一講。

 

 

  PhoneGap

http://phonegap.com/

 

• 開源
• 編寫一次，可編譯到IOS、Andriod、Win Phone。。。
• 支持GPS、攝像頭、文件系統。。。等系統接口

 

 

  jQuery Mobile

http://jquerymobile.com

若是你要開發一款接近原生UI的應用，那採用一款UI框架會節省你不少的時間，jQuery Mobile就是

這樣的一個UI框架。

 

• 跟jQuery沒有絕對關係，你能夠選用其餘的DOM選擇器
• 社區很活躍，已經適用於實際開發
• 雖然運行效率不斷提高，可是目前仍是有點慢，特別是用在PhoneGap上

 

 

  Backbone.js

Backbone.js是一款用在javascript上的MVC框架，你能夠類比成Ruby on Rails、Struts等Server端的MVC框架，

固然，在MVC的模式實現程度上可能有必定的差異。

 

•  一款小型、流行的用於編寫大型HTML5應用的MVC框架
• 他們在用backbone：LinkIn,Soundcloud,Basecamp,Codiqa

 

 

  上圖是Backbone的MVC架構圖，學習MVC的時候，咱們應該都會接觸到一個技術：模板引擎，由於須要把Model的數據表現到View中，

須要模板引擎這種粘合劑去把二者粘合起來。Mustache就是這樣一個模板解釋引擎

 

Mustache

 

• 支撐普遍的語言種類
• 簡單，可是很強大
• 支持循環
• 你能夠使用underscore.js模板，可是不夠強大

 

 

Require.js

 

• 把JS庫模塊化
• 大型項目必備
• 支持異步加載-加快加載速度

• 支持把多文件壓縮到一個文件中

  Require.js + Tempalte

  Require.js支持加載text文件，所以，能夠用來加載模板文件

define([「backbone」,「underscore」,「jquery」,「text!listview.html」],
function(Backbone,_,$,listViewTemplate){…
Mustache.render(listViewTemplate,this.model.toJSON())…

 

 

 

總結

  框架滿天飛，在框架大海中，撈出你須要的框架，DRY（Dont Repeat Yourself）

define([「backbone」,「underscore」,「jquery」,「text!listview.html」],function(Backbone,_,$,listViewTemplate){…Mustache.render(listViewTemplate,this.model.toJSON())…

define([「backbone」,「underscore」,「jquery」,「text!listview.html」],function(Backbone,_,$,listViewTemplate){…Mustache.render(listViewTemplate,this.model.toJSON())…

• 查看圖片附件

 

http://cavenfeng.iteye.com/blog/1551516