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