前端工程师：现在是最糟糕的时代，也是最好的时代

图片来源于网络，与文章无关

从行业角度看，前端最糟糕的时期已经过去了；从开发者角度看，现在确实是个糟糕的时代。

首先从前端行业的发展历史来看，前端正在变得越来越成熟。如果和过去相比，之前的前端才是真的糟糕。如果我们从未来的视角来看现在，那么现在也算是糟糕的，但是其糟糕程度也远不如过去。

十年前正处于前端的石器时代，那时的前端开发用一个词语来形容就是“刀耕火种”。糟糕到什么程度呢？

前端开发者的噩梦：兼容IE6。IE6发布于2001年，而ES5直到 2009年才定稿。IE6除了可以运JavaScript 之外还可以运行VBScript、JScript（一个Javascript的方言）。
当时有一个只能运行于IE的技术叫 “ActiveX”，所以很多银行和政府的网站只能用 IE 浏览器打开，甚至只能使用IE的特定版本打开。
还有一个技术是目前已经被淘汰的 Flash。

我们现在所说的前端通常这是包括了HTML、CSS、JS，甚至Node.js、SVG 等和Web UI层相关的开发技术。那么在没有ES6，没有HTML5，没有CSS3的时代，前端到底糟糕到什么程度呢?

糟糕到当时甚至没有”前端工程师”、“前端开发者” 这个词，那时这个岗位被称为“切图师”、“切图仔”。在大部分公司中，HTML和CSS都是由设计师来做，页面中动态效果比如鼠标划过显示菜单、轮播图等则是由后端开发者来完成。后端JSP、PHP 开发者兼职写jQuery是当时的普遍现象。

我们再对比一下同时期的后端，各种工具链和技术都已经非常成熟了。那时的前端也只是作为了后端MVC架构中的View层，在没有前后端分离的时期，View层也是由前端和后端一起开发的。现在我们开发前端项目都会涉及到打包、压缩、混淆等，而在之前虽然大型前端项目还是少数，当涉及到几百个js文件的时候，前端也会使用到打包、压缩、混淆等工具，而这些工具当时几乎都是由Java提供的，流行的有雅虎开发的YUI Compressor、谷歌开发的Google Closure Compiler。

前端经过这么多年的发展，尤其是Node.js发布到成熟的这几年，已经变得非常成熟，而“糟糕"的时代也已经成为了历史。

另一个角度，我们作为前端开发者，现在也许是个糟糕的时代。以前的开发技能经过这么多年的发展已经不再适用。前端逐渐规范的后果就是淘汰了一大批“古典/保守”前端开发者们，而抓住风口的开发者们已经实现了弯道超车。

常言道”乱世造英雄"，但是常言也道“乱世埋枯骨”。在Node.js出现之后，前端可谓是当时最有“钱途"的行业之一。目前这个风口也应关闭了，所以对很多人来说，现在是一个糟糕的时代。

如果我们看一下大厂，以阿里为例，基本上前端的那些高P都是在2010年之后搭着Node.js的快车一路升上来的。Node.js 不仅拓展了前端的边界,还提升了前端的研发效率。

有人说只有糟糕的东西才需要不停的推倒重来。

这句话我不认同，我觉得这句话的原因和结论都有问题。首先颠覆的不是前端，而是前端的某个技术和工具；再者并不是因为糟糕所以颠覆，而是因为前端具有生命力所以才有颠覆性的创新和改变。我们看看后端，以前Java开发都是用Eclipse, 而现在几乎清一色的IDEA,那么我们是否能得出结论Java在不停的推到重来，所以后端处于-个糟糕的时代。显然不能。

工具的更新换代才能带来前端的繁荣。我们来讲一个真实的故事吧。

英国工业革命时期，机器生产逐渐替代手工劳动，导致大部分人失业、工资下跌。失业了就没事儿干了，于是他们开始思考思考:

我们为什么失业呢?因为工厂不需要这么多人。

厂为什么不需要这么多人呢?因为机器可以做很多事。

如果没有机器呢?那么工厂就多招人。

终于找到失业的原因了，于是莱斯特郡一个名叫卢德的工人第一个捣毁织袜机，进而在全国掀起了砸毁机器的浪潮，无数工人涌入工厂将机器砸毁。2333333，这场运动被称为"卢德运动”。而这次运动导致很多工厂被迫停工，加剧了更多工人的失业。最终英国政府制定律法，并对卢德分子进行镇压。

在故事中，"机器生产逐渐替代手工劳动” 是一次生产力的变革，作为类比，前端技术的更替也正是生产力的变革，对比一下 React/Vue开发维护几万行代码的项目和用jQuery开发维护几万行代码的项目，哪个更容易。是技术上的差距吗，也不尽然，只要规划的合理，jQuery 一样可以开发大于大型项目的工具链了。

我之前是一名Java开发者，直到Chrome、Node.js 发布后我对前端越来越感兴趣，后来转行称为前端开发者，我经历过前端最糟糕的时代一一兼容 IE5.5，也搭着前端的快车实现了工资爆炸式增长。当我刚学会最流行的Prototype库时，jQuery 出现了；当我刚学会Underscore后，Lodash出现了；当我庆幸自己没学Grunt而直接学了Gulp时，Webpack出现了。我大概在2015/2016年实现了自己的第一个目标:工资翻10倍。

不要疲于追求新的工具，给自己明确清晰的定位,然后去学习不同领域的相关知识。我入行前端以来就一直深耕前端工程化以及前端性能两个方向。而新工具新框架出现后,不应该仅仅停留在作为一个框架的使用者，而应该考虑框架为什么出现，解决了哪些痛点，如果没有XXX框架的出现我是否能解决类似的痛点....

总而言之，说的俗一点就是，目前前端处于糟糕的时代,是因为前端开发者的工资无法向之前一样爆炸式增长了。但是现在也是最好的时代，前端开发者可以靠综合能力获得更高的薪酬，如何将自己的前端知识转化为生产力，在公司中，是做到了“为研发提效，为业务赋能”，还是仅仅只会某个框架的知识，天天写bug，找bug，改bug。

对一些开发者来说感觉目前前端太糟糕，还有一个原因就是工具迭代太快，而又没有大牛来指导，面对众多的前端技术感到眼花缭乱，不知道如何学习，更不知道该学习什么。

然而网上的知识点都比较零碎，不成体系，自己看书但缺乏实践，看了不少的知识但是在实际项目中却依然使用不到。干了几年之后提升也不是很多，甚至遇到了职业的天花板。

想学习前端web的朋友，可以加入这边的技术交流裙，点击此处蓝字进群，裙里从学生到大佬都有，还有一份2020年大厂面试题真题合集（含答案）可以免费获取，不见不散哦！

HTML

浏览器页面有哪三层构成，分别是什么，作用是什么?
HTML5的优点与缺点？
Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?
HTML5有哪些新特性、移除了哪些元素？
你做的网页在哪些浏览器测试过,这些浏览器的内核分别是什么?
每个HTML文件里开头都有个很重要的东西，Doctype，知道这是干什么的吗？
说说你对HTML5认识?（是什么,为什么）
对WEB标准以及W3C的理解与认识?
......

CSS

解释一下CSS的盒子模型？
请你说说CSS选择器的类型有哪些，并举几个例子说明其用法？
请你说说CSS有什么特殊性?（优先级、计算特殊值）
常见浏览器兼容性问题与解决方案？
列出display的值并说明他们的作用？
如何居中div, 如何居中一个浮动元素?
请列举几种清除浮动的方法(至少两种)?
block，inline和inlinke-block细节对比？
什么叫优雅降级和渐进增强？
说说浮动元素会引起的问题和你的解决办法
你有哪些性能优化的方法？
......

JavaScript

js的各种位置，比如clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop的区别？
js拖拽功能的实现
异步加载js的方法
js的防抖与节流
说一下闭包
说说你对作用域链的理解
JavaScript原型，原型链 ? 有什么特点？
请解释什么是事件委托/事件代理
Javascript如何实现继承？
函数执行改变this
babel编译原理
函数柯里化
说一下类的创建和继承
说说前端中的事件流
如何让事件先冒泡后捕获
说一下图片的懒加载和预加载
js的new操作符做了哪些事情
改变函数内部this指针的指向函数（bind，apply，call的区别）
Ajax解决浏览器缓存问题
......