有一天，我们组的一个小伙伴突然问我，你知道有一个岗位叫重构工程师吗？这个是来做什么的？重构工程师的问题引发了我对前端领域发展的思考，所以整理一下前端领域的发展历程，顺便对2017年的趋势做一个小小的预测。如果不想看内存的，可以跳到后面看前景。上帝说，要有光，就会有光。从1991年TimBerners-Lee公开提到HTML描述，到1999年W3C发布HTML4，写网页是为了更好的交流彼此的想法，为了能够维护自己的网页，各路大神也表示他们的神通，甚至发明了PHP（世界上最好的语言）。那段时间没有所谓的前端开发职位，大家都是软件工程师。当然，这个时代也是神人辈出的时代。互联网或者整个IT行业太多的概念和原型都是在这个时期形成的。谷歌网站正式上线，个人PC逐渐普及。上帝称空气为天空。O'ReillyMedia、Battelle和MediaLive在2004年10月领导了第一次Web2.0会议。web2.0时代开始了。博客、维基和RSS个人网站开始登陆大家的视野。与此同时，豆瓣、天涯，这些符合2.0时代的产品开始在中国走红。我们拥有第一批专注于Web前端的软件开发人员。与此同时，FaceBook在美国诞生。版本发布。在上帝称旱地为陆地，水聚处为海之后的几年里，前端开发页面基本围绕着MooTools、Underscore、Prototype、Dojo、jQuery、YUI等各种库。各大类库也互相吸取优点，不断完善自己，但本质上并没有太大变化。与此同时，在我们看不到的背后，第二次浏览器大战打响，V8引擎开始大放异彩，Web标准也在推动ECMAScript5.0的演进。Node的发布意味着我们的前端领域扩大了，我们已经触及了服务器端。随着智能手机的普及，移动端的趋势势不可挡，Web前端开始为移动端开发各种类库。SenchaTouch、Zepto.js、JQMobile、HTML5的概念开始流行起来。战局也到了水火不容的地步，推特也推出了领先的CSS工具包Bootstrap。随着系统硬件和V8引擎性能的提升，整个网页的性能有了很大的提升。大家已经开始开发复杂的网页了。这种需求开始催生前端开发者的工程化思维。关于模块化加载的问题，AMD、CMD、UMD登场，衍生产品Seajs、requirejs开始分地盘。这个时代依然是服务端渲染为王的时代，包括很多模块或者组件的拼接都是在服务端完成的，但同时也开启了jquery+requirejs+template的模式来开发复杂的页面。（这段时间出现了重构工程师和JS工程师的分工。）经过12年的日夜管理，随着W3C规范和标准的进一步推进，网页的复杂度进一步加剧，人不再是对Jquery感到满意。在面条的发展中，出现了很多简化客户端开发的框架，比如Backbone、Ember、AngularJS、Vue、Avalon、Knockout、React以及各种MV*框架。这是一个隔离的时代，这么多框架如雨后春笋般涌现，每个开发者根据自己的喜好和业务需求选择不同的框架来实现自己的目标。Node.js开始兴起，Express和Koa框架开始应用于各种生产项目。PM2的服务管理解决了企业的监控和稳定性问题。与此同时，阿里开始探索Node.js的发展之路。提供前后端分离解决方案。上帝说，更多的水应该滋生生物。微信这个社交巨头已经崛起。微信的公众号玩法让前端工作火了，也开始带来Web和Native的纷争。15年，Facebook在React.jsConf2015大会上推出了基于JavaScript的开源框架ReactNative，一举将React推向了一个新的高度，一次学习，到处编写。今年是React年。同时，构建工具也在不断迭代。Grunt的辉煌已经远去，Gulp的宝座未久，Webpack的风暴席卷而来。2016年，Webpack成为前端打包构建的主流，Vue强势崛起，Ng2发布。前端在主流开发中基本形成了三国时代（React、Vue、Ng）。同时，移动端也形成了基于混合开发的方式，在We??bview页面中嵌入了Native。由于网络和硬件性能的不断提升，前端已经从原来的cs模式变成了现在更像bs的模式，但还是有cs的分布式优势。上帝按照自己的形象造人--Segmentationorsplitting上文回顾了前端的大致发展历程，下面说说对2017年前端发展的一些预测。随着不同的业务，各团队在前端技术上开始分化：重载SPA页面、Hybrid风格的Web页面活动页面、游戏等重载SPA页面——Teambition重载SPA页面，业务功能极其复杂，使用Vue、React、Angular的MVVM框架后，在开发过程中，不可避免地会出现越来越多的组件，父子组件之间的通信，子组件之间的通信频率都会大大增加。如何管理这些组件之间的数据流将成为此类WebApp的最大难点。在页面加载方面，SPA第一次可以依靠加载动画来掩盖一些页面加载性能问题（这里TB通常需要5秒左右加载），不需要做大量的延迟加载和延迟加载。因为后面还要用到相关数据，所以不存在会不会用的问题。从最近Rx.js的star统计也可以看出大家越来越关注数据管理的问题。本地数据管理只是一方面，还会涉及到多个用户的数据同步问题，即服务端与客户端的数据同步问题，比如及时正确的同步数据。数据及时正确同步的概念是指：多人操作一个任务时，两个人在修改一个任务时，很容易造成数据覆盖。A刚修改完，几秒后B也修改了。因为同步不及时，B不知道A被修改了。导致B新修改的数据覆盖了A的修改。因此，为了减少类似的错误，需要保证数据的及时、正确的同步。由于数据和请求非常多，我们必须利用好本地缓存和各种存储。将使用LocalStorage和SessionStorage。这么多的业务和组件，难免会对内存造成压力。如何管理好内存也是一门学问。典型的就是元器件的破坏。如何合理的创建和销毁组件，以及组件内部数据的组织将是非常困难的。测试编码器。相关信息请看@徐飞的文章混合式网页——大多数App的主流混合式开发是目前移动端的主流。这类网页的特点是业务不复杂，大多以展示信息为主，加上一些操作按钮，需要解决的问题是经常需要和Native通信，很难解决国内各个厂商在Android的webview中的问题。自带浏览器，统一底层支持。对于jsbridge的实现，每个公司都有不同的实现方案，主要看Native的开发如何定义bridge的方案。从我自己的开发经验来看，有几个点需要解决：用户认证问题，如何来确认Native的用户身份，是使用原网站常用的session还是Native常用的token，但无论使用哪一种，都需要Native帮忙注入logo。Ajax请求问题，如果使用URL嵌入，单独发送ajax请求没有问题，但是如果使用Html文本，直接Webview渲染的方式类似于在PC上打开文件夹中的html文件，并且ajax请求发不出去，需要Native帮忙做一个桥接调用。至于沟通成本，与原来的PC端相比，参与者更多，排错也更麻烦。这主要取决于App整体架构是如何设计的。性能问题，怎么说呢，不是每个App开发人员都很好，所以如果Native代码有问题，Webview报错的概率会变高，比如css3动画，很容易导致crash，high内存占用等。因此，对于web前端这个方向的开发者来说，如果有过Native开发的经验，会更加游刃有余。活动页面——比如来自宇宙的邀请函等活动页面，主要设计和动画效果炫酷、吸睛、震撼。基本上，一个精彩的活动页面就能在朋友圈掀起波澜。该技术主要基于WebGL，一般使用Three.js渲染canvas来显示各种动画和视觉效果。这个方向的前端会更加注重浏览器的兼容性、性能、设计效果、动画流畅度、体验等，主要兼容微信的浏览器，因为需要在朋友圈做营销，一般来说，他们会偏向于设计和动画。游戏及其他——H5小游戏、数据可视化当时国内流行的H5小游戏很多，基本都是用CreateJs做的，接触少，评论少。HTML游戏引擎随着大数据时代的到来，前端领域的各种数据可视化库也层出不穷。D3、Highcharts、国内的Echarts都是这个领域的佼佼者。转行其实还有一个领域，就是通过Nodejs学习服务端的各种知识，转行到服务端领域。以后我上面说的细分（或者说碎片化——更多的噱头），自我感觉，已经慢慢呈现出一些趋势了。不知道你有没有感觉。比如许飞会比较擅长TB等重载业务的会比较关注Hybrid流派，甚至会自己开发Weex这样的JS-Native开发框架。当然，大部分开发者可能还是会做，并没有明显的倾向，但是随着公司业务的变化，公司重点资源的倾斜，很多开发者还是会逐渐分化。我个人认为这样的细分其实对我们前??端还是比较有利的。前端业务的权重和场景的多样化表明前端整个领域发展比较迅速，各方都参与其中。它一直随着时代的发展而发展。细分领域多种多样，人人可以专攻一机多能。不同细分领域的知识点需要认真学习和研究。比如前端的数据组织趋向于中心化和标准化（Redux等），要求前端同学了解基本的数据库原理。理解每个领域的知识点是一个巨大的挑战。有利于交流。各行各业的人可以拿出自己的拿手好戏，相互交流，取长补短，建立起更加系统的知识网络。其实想说的很多，感觉说不完。比如@古云提议加入Backbone、Ember、AngularJS、Vue、Alavon、Knockout，React框架在一个时间段内没有出现。生态学的一部分。不过感觉不是我这篇文章的重点，所以就没加了。还有就是现在Native和Web前端之间的竞争与合作。原文及讨论地址：知乎原文（以上仅为个人观点，如有雷同，只能说大侠见同）
