有一天，我们组内的一个小伙伴倏忽问我，你晓得有一个叫重构工程师的岗亭？这是干什么的？重构工程师
这个题目引发了我对前端范畴生长的思索，所以我来梳理下前端范畴的生长过程，趁便小小的瞻望下2017年的趋向。不想看回想的，可以直接跳到背面看瞻望。
神说，要有光，就有了光
自1991年蒂姆·伯纳斯-李公然说起HTML形貌，到1999年W3C宣布HTML4时期，写网页是为了更好的交换互相的主意，为了可以保护本身的网页，各路大神也是八仙过海各显神通，以至发清楚明了PHP（这个天下最好的言语）。这个时期并没有一个所谓的前端开辟岗亭的，人人都是软件工程师。固然这个时期也是神人辈出的时期，太多如今互联网或许说全部IT行业的观点和雏形在这个时期构成。Google网站正式启用，个人PC最先逐步进步。
神称氛围为天
O’Reilly Media、Battelle和MediaLive在2004年10月指导了第一个Web 2.0大会，web2.0时期开启，Blog，Wiki，RSS种种个人网站最先上岸人人的视野，同时，豆瓣，天际这些相符2.0时期的产品最先在国内大行其道。我们有了第一波注意Web前端的软件开辟师，一致时刻，米国诞生了FaceBook具有跨时期的产品，05年，校内网涌现，前端们最先活泼起来了，06年8月，Jquery的第一个版本宣布。
神称旱地为地，称水的聚处为海
以后的几年间，前端基础都是围绕着种品种库如MooTools，Underscore，Prototype，Dojo，jQuery ，YUI开辟页面。各大类库也是互相吸取长处，不停完善本身，然则实质没有太多变化。
与此同时，在我们看不到的背地，浏览器第二次大战打响，V8引擎最先大放异彩，Web范例也在推进ECMAScript5.0进化着。Node宣布了，意味着我们前端的范畴扩展了，伸手到效劳端了。
智能手机最先进步，挪动端大海潮水势不可挡，web前端们最先为了挪动端开辟种品种库了Sencha Touch，Zepto.js，JQ Mobile，HTML5观点炽热了起来，种种网页小游戏屡见不鲜，和Flash的争斗也到了方枘圆凿的田地，Twitter 也推出了 Bootstrap这个引领风流的CSS东西包。
跟着体系硬件的提拔，V8引擎机能的提拔，全部网页的机能极大进步，人人最先纷纭开辟出庞杂的Web页面来，这类需求最先催生了前端们对开辟的工程化思索，首当其冲的就是模块化加载的题目，AMD、CMD、UMD 登上舞台，起衍生的产品Seajs，requirejs最先离别土地。
这个时期照样效劳端衬着为王的时期，包含很多模块或许组件上的拼接都是在效劳端完成的，但同时也开启jquery + requirejs + template开辟庞杂页面的情势。（这个时间段，涌现了重构工程师和JS工程师的离别。）
治理日夜，离别明暗
12年以后，跟着W3C范例和范例进一步推进，人人对Web页面庞杂度进一步的加重，人们不在满足于Jquery面条时的开辟，涌现了很多用于简化客户端开辟的框架，诸如Backbone，Ember，AngularJS，Vue，Avalon，Knockout，React等等林林总总的MV*框架。
这是一个群雄割据的时期，云云多的框架涌出，每一个开辟者依据本身的喜欢，营业的需求挑选着差别框架来完成目的。
Node.js最先兴起，Express，Koa框架最先运用到种种生产项目中，PM2的效劳治理，为企业处理了监控和稳固题目，同时，阿里最先探究Node.js中间层的开辟途径，一连发声，供应前后端星散处理计划。
神说，水要多多滋长有性命的物
微信这个交际庞然大物已然兴起，微信民众号的弄法，让前端岗亭最先炽热了起来，也最先带来了Web和Native的争端。
15年，Facebook 在 React.js Conf 2015 大会上推出了基于 JavaScript 的开源框架 React Native，一举将React推上了一个新的高度，learn once ，write everywhere。这一年是属于React的年份。
同时，构建东西也在不停的迭代，Grunt的光辉已去，Gulp并未在王座上久呆，Webpack的风暴就席卷而来。
16年，Webpack已成为了前端打包构建的主流，Vue强势兴起，Ng2完成宣布。前端在主流开辟上基础构成了三国时期（React，Vue，Ng）。与此同时，挪动端也构成了以夹杂开辟为主的体式格局，Native嵌入Webview页面。
由于收集和硬件机能不停提拔，前端从本来的cs情势到如今更像 bs，但也依旧有 cs 的分发上风。
神就照着本身抽象造人 — 细分或许分裂
上面回想了一下前端也许的生长进程，下面来讲说本身对17年前端生长的一些瞻望。
跟着营业的差别，每一个团队在前端手艺点最先有所分化：
重型SPA页面
Hybrid体式格局的Web页面
运动页面
游戏等其他
重型SPA页面 — Teambition
重型的SPA页面，营业功用极为庞杂，运用Vue，React，Angular这类MVVM的框架后，在开辟过程当中，组件必定愈来愈多，父子组件之间的通讯，子组件之间的通讯频次都邑大大增添。怎样治理这些组件之间的数据活动就会成为这类WebApp的最大难点。
从页面的加载来讲，SPA可以依托初次加载的Loading动画，来掩饰一些页面加载机能的题目（TB我这里加载平常在5S摆布），很多懒加载和耽误加载之类的也是不须要做。由于相干的数据背面都须要用到，也就不存在是不是会运用的题目。
从近来Rx.js的star数，我们也能看出来，人人也愈来愈体贴数据治理的题目，当地的数据治理只是一个方面，还会涉及到多个用户数据同步的题目，也就是效劳端和客户端数据同步题目，如和实时准确的同步数据。
实时准确同步数据这个观点指的是： 多人操纵一个使命时，两个人都在修正一个使命时，轻易形成数据掩盖。A刚修正完，B过几秒也修正了，由于同步不实时，B不晓得A修正了，结果B新修正的数据掩盖了A的修正。所以想要削减相似的毛病，就必须要能保证实时准确的同步数据。
既然数据和请求云云多，那末就肯定要利用好当地的缓存和种种存储了，LocalStorage，SessionStorage的都邑运用上。
云云多的营业和组件，必定对内存上会形成压力，怎样治理好内存也是一门学问，比较典范的是组件的烧毁，该怎样合理的创建和烧毁组件，已组件内部data数据的构造都邑很磨练代码职员。
相干的可以看@徐飞的文章
Hybrid体式格局的Web页面 — 如今大多数App的主流
Hybrid体式格局的开辟现在照样挪动端的主流，这类web页面的特点是营业并不庞杂，大多是展现信息为主，再加上一些操纵按钮，须要处理的题目，在于很多时刻要和Native来通讯，而且Android的webview有林林总总的国产厂商题目也是很难以处理，这方面微信做的不错，直接搞了一个本身的浏览器来一致底层的支撑。
关于jsbridge的完成，各个公司有差别的完成计划，重要照样要看Native的开辟怎样来定义bridge的计划，以我本身开辟的履历来看，有这么几个点须要处理：
用户考证题目，怎样来确认Native的用户身份，是用本来Web网站经常使用的session照样运用Native比较经常使用的token，然则不管用哪一种，都须要Native帮助来注入标识。
ajax请求题目，假如运用一个URL的情势来嵌入，可以单独发送ajax请求没有任何题目，然则假如运用Html文本，直接Webview衬着的体式格局，就相似PC上，文件夹翻开html文件一样，ajax请求发送不出去，须要Native帮助做bridge来挪用。
沟通本钱题目，由于和本来PC端比拟，多了介入方，所以排查题目就越发麻烦了，这个照样重要看团体App的架构怎样设想了。
机能题目，怎样说呢，不是每一个App的开辟职员都很凶猛，那末假如Native的代码有题目，Webview失足的几率就会变高，比方Css3的动画，轻易引发崩溃，内存占有率太高等等。
所以，关于这个方向的web前端的开辟职员来讲，假如会Native开辟的履历越发瓮中之鳖。
运动页面 — 比方来自宇宙的邀请函
这类运动页面，重要就是设想和动画上结果炫酷，吸人眼球，震撼人心，基础出来一个出色的运动页面，都能在朋友圈掀起一波海潮。手艺上以WebGL为主，平常运用Three.js,衬着canvas来展现种种动画和视觉结果。
这个方向的前端会越发关注，浏览器的兼容，机能，设想出来的结果，动画的流通度，体验等等。重要兼容的微信的浏览器，由于要在朋友圈来营销，整体来讲，会偏设想以及动画些。
游戏等其他 — H5小游戏，数据可视化
当时风行国内的种种H5小游戏，迥殊多，基础是用CreateJs来制造的多，打仗不多，不多批评。
跟着大数据时期的降临，前端范畴种种数据可视化的库也是屡见不鲜，D3，Highcharts，国内的Echarts都是这个范畴的佼佼者。
转范畴
实在另有一个范畴，就是经由过程Nodejs，进修效劳端的种种学问，切换到效劳端范畴去。
将来
上面的我所提到的细分（或许说是分裂–比较有噱头），自我觉得，已在逐步展现出一些趋向了，不晓得人人有木有觉得到，比方徐飞就会越发善于TB这类重型营业派别，而手淘的人就会比较关注Hybrid的派别，以至本身来搞Weex这类JS-Native开辟的框架。固然大部分开辟职员照样能够都邑做，没有那末显著的偏向，但跟着公司的营业的改变和公司重点资本的倾斜，很多开辟职员照样会逐步有所辨别。
个人认为这类细分实在对我们前端越发有益的，
前端营业重量化、场景多样化，表现出前端全部范畴生长比较敏捷，各方面都有介入到，一向跟跟着时期生长而生长。
有种种细分的范畴，人人可以做到一专多精，差别细分范畴的学问点，都须要仔细的进修和研讨，比方前端对数据的构造趋于集中化和范式化（Redux等）请求前端同砚要懂基础的数据库道理。可以吃透每一个范畴的学问点，都是一个庞大的应战。
利于交换，种种差别分支的人，可以拿出本身专长的手艺来互相交换，取长补短，构建越发体系的学问收集。
实在要说的很多，觉得说不完，比方@寇云 发起加上Backbone，Ember，AngularJS，Vue，Alavon，Knockout，React 框架不是一个时间段涌现，先驱者的头脑被后生框架集成生长，以及框架生态这部分内容。但觉得并不算我这篇文章的重点，就没有加上。另有现在Native和Web前端之间的协作与协作。
原文和议论地点：知乎原文
（以上只是个人见解，如有雷同，只能说英雄所见略同）
