我接触过的阶段

应该是从jquery+div开始第一次接触的,那时候整个前端对非这个方向的人还是很麻烦的,css和布局都不会调整,即使会写脚本随意的操作dom,写出来的界面也是丑陋无比。这个时代想要个好看的动态控件都是靠找javascript库。

第二个阶段是bootstrap,总算有一个不用靠设计师也能做出对齐标准的css框架了,而且学起来还不难。随后一大片bootstrap like的小网站就纷纷冒出来了,以及更多的css框架也发布出来。虽然一时间也审美疲劳,但是不可否认这种css框架解决了基本的控件样式和对齐问题。

第三个阶段应该是ember,backbone这种库吧,我没有参与到这个阶段,但感觉上这应该是SPA,rich client的一个过渡阶段。这个阶段的库包含了model,view,controller,router,store等元素,整个就是一个rails的客户端化。这样一个发展方向有些偏激了,库的学习成本高,并且很难和别的库,框架兼容,所以我认为这是一个过渡阶段。

第四个阶段就是现在,以reactjs,angularjs为代表的组件化和数据绑定阶段。这个阶段基本上屏蔽了dom操作,使得页面标签更具语意和功能,可读性和可维护性都更高。这个阶段的关键技术是指令,filter,组件。

在组件化和数据绑定时代下的选择

这是一个比以前都好的时代,从技术上说,各种表现技术越来越完善,门槛越来越低。

组件化和数据绑定为基础,并以指令和filter相配合,在客户端的model,view层面已经是威力倍增。我认为目前的技术条件下,前端的开发结构以VM(view,model)为一个聚集,styling,router为另一个聚集是合适的。

styling就是各种css框架,从bootstrap开始,无数的后起之秀,带来了丰富的基本控件和页面结构,以及多种的终端适配,PC的,HTML5的,hybrid app的。特别是介入SPA的内页切换后,内置的router和基本的约定规则势在必行。

另一块则是view,model,view负责渲染模版,model负责向模版提供数据。特别是数据绑定的概念普及以后,操作dom渐渐被视为异类,这两块已经没有必要再拆分了。view在渲染模版方面则出现了自定义组件的引擎,并配合指令和filter,极大的拓展的页面代码的复用和可理解性。

基于这一看法,ember等全面的MVC router大框架逐渐淘汰也是必然。大家其实要的是更好的组装性和组件性,而不是在一棵树上吊死。

在VM库上,除了代表者reactjs和angularjs,还有很多后起之秀,如Vue.js。angularjs我看过,用内置的指令还简单,自己开发新指令文档描述的令人发指。reactjs也看了,我实在不喜欢把组件和代码都写到script标签下。最后选定的还是Vue.js,数据绑定简单明了,新建组件、指令和filter也都是一句话的事情。

至于Vue.js这样的VM库是否适应所有的web项目,我还是觉得这要考虑项目想做成什么样子,以及server端框架的完善性。如server端是rails,多数情况是没必要用VM库的。但是若开发一个SPA,从服务端取json,那一个适合的css框架和VM库,会让工作事半功倍。