一个C++眼中的前端技术发展的规律

背景

由于项目原因，从一个Windows客户端开发，跳进前端开发这个大坑。从一开始的茫然，到下定决心放空心态学习，到现在逐渐有了清晰的思路。我想，许多从客户端（后台）转来学前端的，应该和我有类似的经历。

1段：指令化编程

一开始学习的是基本的html，css，用简单的javascript操作DOM。这是最迷惑的阶段，抛去HTML/CSS的各种标准，各种浏览器的兼容等干扰信息。在页面中的script标签中，写下操作DOM的代码。这个阶段，像极了刚开始学习C语言，做作业的场景。一段代码，完成一个任务。

2段：函数（库）式编程

项目中遇到了稍微复杂的需求，比如msgbox，slider等，网上搜到的都是jQuery的扩展。于是乎发现了jQuery以及 Zepto，好像终于发现了终极武器，从此信步于代码江湖。原来这些都是YY，写一些些简单的页面骗骗妹子可以，真正的生产环境中，这才是初级。这个阶段，像极了学习数据结构时，用C写一些简单的应用，比如一个简易编辑器。会用到很多其他人封装好的常用操作，比如文件操作等。

3段：结构（模块）化编程

随着项目变多，很多东西可以沉淀下来，在其它的项目中使用。这就需要把一个特定的功能的文件封装起来，当有项目需要时，可以引入进来。这里要解决全局变量命名空间污染问题，作用域问题等。比如，AMD、UMD、CommonJS标准，再比如requirejs，seajs，nodejs等，都针对这个解决了问题。只有到了这个阶段，工程化才能真正的起来。因为不用重复造轮子了。这个阶段，像极了用C语言开始工作后，使用公司及外界现有模块开发。

4段：面向对象编程

手头的模块逐渐多起来，但还是多不过变换无穷的需求。有些需求，用A模块实现了，但下一个需求，和A类似，于是有人写了B模块。当你用的时候，会纠结于用A还是B？那么我看下载量吧，选了一个下载量大的，结果下载下来，还是需要手动该一些代码，才能适合自己的需求。现在npm，估计很多都是这种情况吧。只有语言更深一步的抽象，更好的封装，且在一个强大的基础类库下，才是个好的解决方案。React，Backbone，ES6以及各种框架，也模拟了面向对象的一些特性。这个阶段，回想起Borland公司的Delphi和C++ Builder，在Windows客户端开发时期的辉煌，就把这个玩到了极致。

5段：组件化编程

还原真实世界，工程无一不是由各种基本的元件搭建起来的。到了软件工程世界，就是组件化编程。这是工程的最高效率阶段，各种“快速开发工具”纷至沓来。市面上有各种酷炫的组件，并号称“一行代码就能让你的项目也同样的吸引眼球”。还是Borland公司，把这个玩到极致，回想起为了实现一个效果，第一反应不是如何从技术考虑，而是在网上找“控件”的破解版。同样，遇到了bug，很少自己去修改（也很难改），而是再去搞一个控件来。目前，React正在这个阶段发展，当各种Component积累成熟后，前端开发效率会进一步提升。这个阶段，对标的还是Borland公司，还有微软的 COM技术。

6段：面向服务

面向组件的缺点是明显的，为了一个效果，引入一堆代码（以及bug）。我只需要你的服务就好了。把组件功能封装成服务，通过通信协议（RPC，HTTP等）和自己的工程链接起来，就能完成需求。这个阶段还没有明显的对标，我想各种统计代码从概念说应该是相当的，还有各种api接口。也就是说，前端技术中，很可能把面向服务形式，转移到了后端中。

7段：分布式/虚拟化

当网络及虚拟化技术不再是门槛，那么通过分布式及虚拟化技术，能将工程快速部署到各个平台，各个互联网角落。这个阶段前端开发反而不用考虑了。因为分布式天然的网络环境可以提供，而虚拟化由js引擎已经考虑到了。而面向技术的虚拟化已经慢慢开始，React-native，angular，都在慢慢开疆扩土。

附加：打包，部署

在传统的客户端开发中，这些都是IDE提供的，但前端开发却百花齐放。r.js，webpack，browserify，grunt，gulp，duo等。其实不必乱和纠结，找到一个适合自己的就可以了。

总结，至此，经历了一个阶段（半年了吧）的js采坑，才慢慢的思路清晰起来，技术的发展路线都是有规律的。前端的乱，其背后还是有一条清晰的主线的。