写篇文章跨个年,压压精。这算是我对我自己的回答吧,一年多以前我提出了这么一个问题《如何选择前端开发模式?》

当时我一度觉得很迷茫,在搭建web前端项目架构和写代码的时候总觉得哪里不对,但是却哪里都找不到答案,于是开始质疑自己的能力,怀疑自己的人生。现在回过头来看其实那正是日益发展的web前端需求和web前端薄弱的工程架构能力的矛盾导致的。这几年前端可以说是又焕发了它的第二春,然而很多开发模式确停留在几年前,这样导致基于原有的一套模式开发的时候总觉得很变扭,但是又不知道问题出在哪里。现在经历了这一年多了前端新一代框架的发展,许多原来所疑惑的问题现在都慢慢有了答案,首先按照我自己结合最近项目的理解来一一回答之前的疑惑:

1:是否需要使用后端渲染的模板?

答:现在angular,react,vuejs等前端框架都使用了前端模板,但是这些框架主要都是着眼于比较复杂的web应用,对于一些主要以信息展示而且需要SEO的站点来说后端模板渲染页面依然是主流。后端模板渲染也有它的好处,比如说提高首屏信息加载速度,便于分享和SEO。所以很多前端框架也会有后端渲染的模式支持。所以关于这个问题还是主要去看项目的具体要求和团队人员的一个具体配置。

2:如何选择jquery这样的类库,是否需要自己开发一个类库?

答:jquery已经是大家所默认认同的前端库了,它的兼容性造福了广大的码农,它操作dom的api也几乎成为标准。不过如果你使用了angularjs,vuejs等这样的框架那么几乎是可以不需要jquery的,因为这些框架都有MVVM的模式,所以操作dom已经不是问题。但是如果站点并没有使用这一类框架,又对兼容性要求比较高,那么jquery就是你的不二选择。如果不需要对老的浏览器兼容性做考虑,那么其实也可以选择不使用jquery,但是我认为自己开发一个类似的类库就没必要了,当然造造轮子练习一下是极好的。

3:框架的选择 GWT ? angularjs ? backbone ?ember ? Arale ?

GWT,EXT已经是过去的东西了,这一类框架借鉴了客户端开发的一些优秀的模式,但是没有充分吸收web开发的优点。angularjs对于控制台这一类的应用是很好的选择,同样vuejs也可以胜任这一类应用,而且更轻量级一些。backbone和ember这一类我认为也已经是过去式了,我认为它是后端的MVC生硬的搬到web前端。Arale现在也不是很熟悉,不过对于一些不是特别复杂的前端应用如果又有一部分组件的站点来说它还是可以胜任的。这里再多说几句,先抛开以信息展示为主的那一类比较偏传统的web站点来说,对于复杂的web前端应用,我比较喜欢拆封为两类,第一类是大量表单处理的应用台类的应用,推荐使用angular或者vuejs。另一类是应用型的web应用,这一类我认为组件化是关键。所以应该选择对组件化支持比较好的react,polymer,vuejs来开发。这两类我暂时叫做表单型和应用型吧,后面还会提到。

4:UI应该怎么处理,bootstrap?jqueryui?怎么样规划自己的UI库?

一些简单的页面用bootstrap和jqueryui是没有问题的,不过对于复杂一点的项目,如果是表单型那我认为也还是可以用的,但是如果是应用型,那么就对应了组件化,所谓组件化那自然是对样式的隔离和共享的要求比较高,所以还是最好能够采用css-modules或者shaly dom等组件化样式的解决方案,不过当然bootstrap的样式是可以copy过来用的,另外也有很多基于react等现成的组件库可以使用。

5:模块怎么管理?模块加载器,构建工具,上线方案?seajs ? requirejs ?grunt ?

现在看来webpack+npm已经是主流了,构建工具可以再假设gulp,可以参考我之前写的《终于看到了前端模块化统一规范的曙光》

6:设计模式?MVC? MVVM?

MVVM可以说已经是必不可少的了,数据和dom双向绑定已经是前端框架的必须要素。但是我认为MVVM对于应用类项目来说只是满足了局部的一个需求,它使得构建组件更加方便,但是组件直接,项目全局的一个架构呢?我想有一个可以尝试的答案应该就是flux了。

7:怎么组织碎片?CMS? 提高可扩展性?

组件化可以使得更容易去组织项目代码,通常也更方便和CMS结合,但是至于CMS由于缺少这方面的经验,我也不是很了解,不知道大家知道有什么好的CMS管理系统没有。

8:面对不同的后端开发语言应该有不同的适应方式?java? php?nodejs?

记得去年关于使用NodeJS搭建大前端的想法火及一时,这确实是一个解决方案。但是对于由于人员配置或者历史原因或者项目的特性无法实现大前端的团队来说这并不是唯一的选择。无论后端用什么语言,最关键的就是要实现前后端分离,提高开发效率。这个分离不一定是要通过NodeJS,如果需要有后端模板的只要能够将模板渲染层模拟出来就OK,没有后端模板的就更简单了,只要有mockdata就可以,这两个都可以参考百度的fis3中的模式。

问题回答完了,至于总结,明年再说 :P


浙ICP备2025160166号