javascript MVC框架学习笔记

一、开篇

源于单页web app应用的开发效率低下,最近了解了一下javascript MVC开发相关资料

之前对javascript的了解仅仅是停留在能较熟练的使用jquery上。《基于MVC的javascript web富应用开发》这本书入门还是比较不错的,不过书有点老了。

一大堆开源框架,backbone\canjs\agularjs\requirejs\seajs\zepto

一大堆概念,model\view\control\jsonp\route\ejs\依赖管理\异步加载\Commonjs\AMD

二、一切的一切其实都源于node.js的流行

一切的一切其实都源于html5标准和node.js流行。Web服务性能测试:Node完胜Java

node.js到底是啥?如果开发过j2ee的同学都知道servlet,看看这段代码:

var http = require('http');
http.createServer(function handler(req, res) {
    res.writeHead(200, {'Content-Type': 'text/plain'});
    res.end('Hello World\n');
}).listen(1337, '127.0.0.1');
console.log('Server running at http://127.0.0.1:1337/');
 handler(req, res),这不就是doGet(HttpServletRequest req, HttpServletResponse res)吗。

那node.js和javascript MVC有啥关系呢?相信大家不会拿纯粹的servelt来开发大型的web应用,都会用到struts、springmvc等MVC框架。于是有了nodejs的web开发框架expressjs。expressjs有点类似于j2ee开发中的spring。

spring的核心是DI(依赖注入),那nodejs怎么加载模块的呢,于是有了CommonJS规范。

nodejs也少不了MVC,expressjs中都已经实现,有兴趣的同学可以详细看看。

nodejs也少不了ORM,框架也很多,大家自己google。

nodejs也少不了模板(类似velocity、freemarker),于是有了ejs标准,和各种开源实现。

三、前端开发中的MVC应用

nodejs的MVC和javascript前端的MVC,到底是前者影响了后者还是后者影响了前者,不得而知,我更倾向于是nodejs影响了javascript的开发模式。于是javascript的前端开发也开始使用MVC模式和模块化开发。

  • MVC框架的选型

 backbone\agularjs\canjs是我个人目前比较推荐的三个MVC开源框架,前面两种较流行,特别是agulajs势头很猛:

JavaScript MVC 框架技术选型

backbone更适合入门和概念学习,应用在PC端的web应用开发也和比较合适。

agularjs的概念很新,也很好。学习成本稍微高点,不像backbone那样包容。

canjs是更适用手机端的web应用开发也比较包容。

  • js依赖和异步加载的选型

 上面说道了commonjs。前端开发也有依赖的问题。而且js文件越来越多,不便于管理,于是AMD标准出现了。AMD是在commonjs标准上发展起来的,主要应用在客户端。requirejs是AMD的一个实现。也有commonjs的实现应用在前端的,那就是淘宝的seajs。

选requirejs还是seajs争论很大。我的建议是:

PC端用requirejs;

手机端最好目前都别使用(自己实现一个简单的异步加载就可以了,不需要模块化开发),如果应用庞大到非要模块化开发,那使用seajs更合适。

总结:

PC端javascript MVC开发框架:requirejs+backbone/agularjs+jquery

MOBILE端javascript MVC开发框架:seajs/自己实现异步加载+canjs/agularjs+zepto

四、不得不提的打包

模块化开发带来的好处不言而喻,但是对于前端还是如果不代码那是一场灾难,每个模块一个js文件,如此多的js文件加载是多耗时的一件事。requirejs和seajs都提供了打包方法:

requirejs优化工具

seajs构建工具

grunt,javascript构建工具,类似java的ant

相关推荐