打开HTML5的技术网站,满屏的“5个推荐的JavaScript框架”、“10个移动应用框架”,全都是你妹的框架,
但是,你知道这些框架是干毛用的吗?来吧,我们来梳理一下吧
目前HTML5涉及的框架大致可以分成以下几类:
1、跨平台开发框架:PhoneGap 、 Titanium、 Trigger.IO(商业)
这类框架是向web提供底层硬件的接口,让开发人员可以用WEB的技术开发出Native APP。
2、UI框架:jQuery Mobile、 Sencha Touch、 jqMobi
这类框架提供“控件”:布局、按钮。。。。。。
3、MVC框架:Backbone.js、 Spine.js、 Ember.js
这类框架提供在javascript端上Model、View分离的技术,因为在one page的情况下,javascript
控制的逻辑越来越复杂,需要做这样的分离。
4、依赖与加载框架: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())…
- 大小: 20.1 KB
- 大小: 197.1 KB
- 大小: 79.3 KB
- 大小: 27.5 KB
分享到:
相关推荐
均线理论精髓(纯干货!!).doc
四招帮你尽快提高公文起草能力,纯干货!!精选.doc
四招帮你尽快提高公文起草能力,纯干货!!参考.doc
CSDN Share 是一款出色的Android阅读工具,阅读由 CSDN社区用户分享的技术文档。 通过CSDN Share可以在线阅读或离线下载CSDN 举办的各类技术活动的精彩讲义,以及来自CSDN下载社区由用户分享的技术文档。 马上下载...
【推荐】网站优化-运营推广-SEO干货分享!PPT文档.pdf【推荐】网站优化-运营推广-SEO干货分享!PPT文档.pdf【推荐】网站优化-运营推广-SEO干货分享!PPT文档.pdf【推荐】网站优化-运营推广-SEO干货分享!PPT文档.pdf...
移动web视频(共120多集)、电商项目视频(共59多集)、nodejs(共140多集)、vue2、.react4.js(共55集)、微信小程序开发(共67集)、多套项目实战开发(vue2.0+node.js+MongoDB全栈打造商城;微信公众号开发;百度外卖...
1.5万字超干货!!关于配资、杠杆你想知道的一切.doc
干货满满!.docx9大Python常用技巧!干货满满!.docx9大Python常用技巧!干货满满!.docx9大Python常用技巧!干货满满!.docx9大Python常用技巧!干货满满!.docx9大Python常用技巧!干货满满!.docx9大Python常用...
mysql数据库生产环境性能优化总结,纯干货!!!(三) 从mysql配置的角度优化数据库 1.优化mysql的线程缓存 在生产环境中,会有很多请求连接到数据库。为此系统就需要创建线程处理这些请求。然而如果来一个请求就...
html移动开发手势缩放(纯干货)(基于hammer velocity) div实现手势缩放 移动 实现点击按钮放大缩小 在Android、ios端均可使用 上次为demo 下载后即可使用
干货来了!——这里有一份股权转让协议!总有一款适合你!.doc
站在seo的高度去看我们常见的html标签们(seo代码的优化方法)干货!.docx站在seo的高度去看我们常见的html标签们(seo代码的优化方法)干货!.docx站在seo的高度去看我们常见的html标签们(seo代码的优化方法)干货!.docx站...
CSS3垂直图标菜单-带Tooltip提示框 CSS3多样式小图标按钮-带分享按钮 CSS3可视化网页编辑器-基于tinymce编辑器 CSS3实现一款联系表单-输入框带小图标 HTML5 3D立方体旋转动画 ...12款实用的HTML5干货分享.rar
不同的消防水泵的设置要求,干货分享!.docx
appium 环境搭建,内容详细,操作步骤描述清晰,纯干货。
优选网站优化-运营推广-SEO干货分享!PPT文档.pptx
python重点学习资料,包含python基础、python函数、python类库和方法、实践实例有三个,同时还有我的世界python版本(python要用 2.x版本,推荐用2.6.5) 赠送资料一套(都在书里) 没坑没圈套,良心作者!!! 注意...
网站备案密码忘记怎么办?教你找回备案密码(干货)!.doc
干货!8套H5 App完整源码!果断收藏!-附件资源.txt
PCB相关 80技术操作问题与回复。