从小工到大师--浅谈前端进阶修炼--上篇

436 阅读13分钟

从小工到大师--浅谈前端进阶修炼--下篇

以道驭术,术必成。 离道之术,术必衰

为什么我要写这篇文章?

虽然让我写一些技术方面的分享,也能写出来,大家也能学到一些技术方面的知识。但是那都是些比较术的东西,这些东西,自己去网上搜花点时间研究研究,其实就能学会,价值不是特别大。

真正有价值的是道,道能御术。就像一门高深的武学,分为心法和招式,没有心法,学再多的招式,也无法突破瓶颈,甚至可能走火入魔。

我抛砖引玉,写下自己粗陋的观点,希望能给大家带来一些启发。帮助大家少走弯路,更好的明白提升进阶的方法。

一、灵魂拷问

求其上,得其中; 求其中,得其下; 求其下,必败

你真的热爱代码吗?

或者它只是你谋生的一个手段而已。

如果你的答案是谋生,那也并不妨碍你成为技术大佬。吃饭的家伙,你如果还糊弄的话,不怕丢了饭碗?

如果你的答案是热爱,那你更要努力学习,克服万难成为一名大师了。

一个优秀的程序员必须是一个有追求的人,浑噩度日,当一天和尚撞一天钟的人,永远无法成为优秀的程序员。

如何才能一步一个脚印,成为大师级别的程序员呢?

二、提升方法

(一)知识体系

编程中的知识,很广泛,也很碎片。大多数都是一块一块的知识点。

如果你没有建立起自己的知识体系,那么你的知识是散装的,零散的,就像是一座座孤岛,无法串联起来形成一个整体。不仅限制着你对知识深度的掌握,也很容易造成思考问题的片面性,尤其是会很容易遗忘。

例如,就拿一道经典的题目:从输入 URL 到页面加载完成的过程中都发生了什么事情?

萌新:

一脸茫然,根本不知道该回答些什么:

  • 浏览器发起请求,服务端返回数据,然后渲染页面

可能会偶尔提下http、后台、浏览器渲染等等字眼,但是稍微想问深一点,就一问三不知了。

中级:

在日常开发过程中,有过一段经验,但是没有自己动手梳理过,所以回答不完整,就像挤牙膏一样,问一点,然后想一会,回答一点,但是问的深了,也是不知道。

  • 知道输入url后,会发起http请求
  • 大致知道前后端的交互,以及常见的发生方式get,post等,以及跨域的解决方案
  • 知道浏览器接收到数据后会进行解析,如何解析的不清楚
  • 对于js引擎的解析流程不清楚,可能一些面试题刷过一点作用域链,变量提升等

高级:

可能侧重点有不同,不说每个都精通,至少也是熟悉的。

  • 知道浏览器是多进程的,浏览器内核是多线程的,清楚进程与线程之间得区别,浏览器新开一个窗口是一个新的进程,浏览器会有js引擎线程,界面渲染线程,事件触发线程,http请求线程,以及可以用worker线程处理耗时操作
  • 对从开启网络线程到发出一个完整的http请求中间的过程有所了解(如dns查询,tcp/ip链接,五层因特网协议栈等等),以及一些其他的协议例如websocket,rpc等。
  • 对后台和前台的http交互熟悉(包括http报文结构,ajax,cookie,session,跨域,web安全,http缓存,http2.0,https,localstorage等)
  • 对浏览器接收到http数据后的解析流程熟悉(包括解析html,词法分析然后解析成dom树、解析css生成css规则树、合并成render树,然后layout、painting渲染、里面可能还包括复合图层的合成、GPU绘制、外链处理、加载顺序等)
  • 对JS引擎解析过程熟悉(包括JS的解释,预处理,执行上下文,VO,作用域链,this,回收机制,event loop等)
  • 对于如何优化性能有一定的了解(例如webpack打包的优化,代码编程性能的优化,以及资源缓存,懒加载,按需加载,虚拟滚动,cdn分发,预加载等等)

如果不靠自己动手梳理一遍的话,仅靠在工作中写业务,CRUD或者靠看文档刷面试题,一个开发是不可能全面地掌握这些知识体系的。

为什么要建立自己的知识体系?

好处有很多。

1.由浅入深

只有你自己亲自动手梳理了一遍,才能摆脱那种一学完感觉都会,稍微问深一点就三不知的尴尬。

2.查缺补漏

即使只是前端,知识点如果展开的话,也是非常多非常细的,如果你不梳理一遍,你的知识盲区一定是很多的。

3.构成完整的地图

f2e.tech/?spm=a21iq3…

(二)英语

在网上有人提问尤雨溪大神,为什么Vue最新版中文文档滞后。大神回答,我为什么要牺牲自己赔老婆孩子的时间,来弥补你懒得学习英语?

大神的回答是否合理,暂且不论。不过如果你想成为顶尖的程序员,英语是你无法绕过的话题。

很多人都有一个恶习,就是只看中文文档,尤其是初学者,甚至嫌弃官方的中文文档啰嗦、复杂。非要去看各种技术博客,去吸收一遍别人从官方总结梳理过一遍的输出。

在你需要快速了解某一项技术的时候,这样的做法无疑是性价比最高的。但是如果你需要深入学习并掌握一项技术的时候,官方文档才是最佳食用方式。

英语只是工具,是必须要学好的。而且一点也不难。

如何学好英语?

我总结了下,就是:

  1. 坚持阅读英语文档,虽然你可能看的很吃力,从短期来看,会花费你大量的时间,但是从长期来看,只要你能坚持下去,你阅读起来是会越来越轻松的。
  2. 遇到陌生的英语单词,就去查,就去记,一次记不住,再多查多记几次,直到记住为止。
  3. 放弃使用汉化软件

(三)好奇心

技术的更新换代特别快,如果一个技术专家不学习,你猜多久他会被淘汰?

没错,不出2年。

只有保持旺盛的好奇心,才能对新技术保持热情,并持续不断的学习。

只有有探索欲望的好奇心,你才会去翻看并搞懂各种工具框架的源码,弄懂它的实现原理。

我知道,现在市面上有很多的程序员,都不能算作是真正的程序员,只能算是API搬运工。

以前我也有过这样的想法,一个好用的工具或者框架,我会用就行了呀,各种api背熟就可以了,完全可以胜任工作中的大部分场景,我花那么大力气去搞懂它的源码和底层原理,有什么价值呢?

如果你的追求知识简单的写写页面,数据库的增删改查,这些的确没有用。

如果你有更深的追求,成为专家、架构师,这些只是你的入门门槛。如果你不懂的工具的原理,怎么做二次开发,怎么去性能调优,甚至就算报一个错误,你都修复不了,影响上线。

前端开发,我给你的建议就是

  1. 没事多去看看框架的源码是怎么实现的,绝对能大幅度提升你的代码水平。
  2. 每年至少保证学习2-3项新技术,并写一些实际的作品出来。

(四)洁癖

一个优秀的程序员,必然是眼里容不得沙子的,看到写的不好的代码就难受,想要去改,改的质量更高,更简洁。

如果你对自己的代码质量没有要求,没有下意识地想要去提升自己的编码技术,总想着只要写完上线就行了,你永远也无法写出好的代码。

提升代码的质量,也有几个方法:

  1. 学习大厂的代码规范和风格
  2. 在项目中使用工具例如lint,prettier,强制校验
  3. 多做code review
  4. 看优秀的框架源码学习

(五)T字型

人的精力是有限的,你不可能学会所有的技术。

但是,这是不是就意味着我们就一点不用关心其他技术了呢?

如果一个前端,不了解后台,又如何知道RESTFUL,负载均衡,安全拦截,SQL注入等,又怎么能写出健壮、安全的页面?当然,后端也需要懂一点前端的知识。这样二者沟通起来就不会完全听不懂对方在讲什么,遇到不合理的地方也能给出优化建议,提高工作效率。

我就遇到过一个后端,当时我们在做一个跨域的请求,他定义了一些接口给我,然后,他跑过来找我说,我给你的接口都是post啊,你发送了一堆options的接口给我干嘛。

我当时真是无语死了。

一个优秀的程序员,一定是T字型人才,一精多专。一个前端,除了写前端页面,还了解数据库,服务器,计算机网络,服务端语言,这样才能在开发大型应用时,高效率地编写出高质量的页面。

(六)输出

输出是能够改变一个人命运的习惯。

所以我强烈推荐大家一定要有自己的技术博客或者公众号,并保持一定频率的更新。

输出是一件很耗费时间的事情,短期来看,性价比极低。

人,真的是太容易忽视一件事坚持长时间的价值,高估了短期的利益。

输出为什么能改变一个人的命运?我可不是夸大其词。

1、反向驱动

输出的过程,你必须要对要输出的内容做到极致的熟悉了解,才能输出有价值的信息。有一个模型,叫做水壶模型,说的就是一个人肚子里装的东西很多,但是从壶嘴里倒出来的仅仅只是一丢丢。如果你对输出的内容所知甚少,是输出不了的。

为了输出好的内容,会反向驱动你自己去不断学习,深入挖掘。促进了你个人的成长。

2、无畏布施

佛法中有三施: 财布施、法布施和无畏布施。

财布施就是给需要的人一些钱财;法布施就是牺牲自己的时间去宣传佛法。

最顶级的是无畏布施。所谓“无畏布施”,就是用各种方法帮助那些在无知之中的人,帮助他们走的更远。

在你不断布施的过程中,如果能影响他人并帮助他人成长,佛法中有功德一说,我的境界没有那么高,但是我也会感觉到很满足,很快乐。

3、打造个人IP

在你不断向外输出的同时,不断会有更多目光投向你,关注你,欣赏你。

这时候,合作和机会也就来了,很有可能是某个大佬看了你的文章,觉得写的很好,想要挖你过去一起共事;也有可能是一个老板,公司正缺一个像你这样的技术人才;还有可能是有人会像你做技术咨询等等。

(七)梦想

不想当将军的士兵不是好士兵。

你的梦想是什么?

有的人说我的梦想就是不上班。

当然可以,不上班那就是自由职业者,也有技术好的程序员实现了,自己接单自己做。这也需要建立在你技术很好的情况下。

大部分人都是有梦想的,都想成为技术大佬。我也是。

我经常在想,为什么有梦想的人那么多,最后能实现的人寥寥无几呢?

当然这些人都有一些自身性格缺陷,例如懒惰,贪玩,无法坚持等等。

除了这些以外,我觉得阻碍我们实现梦想的最大障碍就是梦想太远太大了,无法具象,也没有及时的奖励机制。为什么我们玩游戏会上瘾,因为游戏的奖励是实时的,会不断刺激着你分泌多巴胺。

例如你说你想成为技术大佬,好,怎么成为,需要多久成为,到底能不能成为呢?这些对于你都是未知的不确定的,你没有动力也就不足为奇。

梦想定的太大太远,你自己都没把握能不能实现,也不知道该如何实现。要么就会陷入一种焦虑状态,一直瞎忙瞎奋斗,要么就是会提不起兴趣,干脆躺平。

所以我们大可以把梦想降低一些,比如:

我要在今年精通react,就很容易实现呀。

(八)数据结构和算法

很多程序员都是半路出家,很多人都没有学习过数据结构和算法。我也是,在很长的一段时间里,我都是处于在学习各种api,根本不知道数据结构和算法这回事。

虽然前端90%的工作场景根本就用不到数据结构和算法,但是这是程序员的基本功。

比如 js的浅拷贝和深拷贝是基于堆和栈的数据结构,React 16 的设计主要是基于 树 和 单链表 两种数据结构以及相关的算法例如diff算法以及为什么要写key,react的hooks是数组的数据结构以及为什么不能写在if else语句里, Webpack 的程序设计是围绕 图 以及相关算法,以及DOM 树、AST 树、以及 Vue、React 的 Virtual DOM 都是树,浏览器前进后退功能通过栈实现,HTTP 缓存响应消息 和 Vue 的 keep-alive 都用到了 LRU 算法等等。

对于前端而言,如果你只想简单的写写业务页面,增删改查等等,不学数据结构和算法,是ok的。如果你想解决一些复杂的问题,或者优化一些工具,或者开发一个辅助业务的脚手架工具,改造框架源码来提高项目的扩展性,或者面对严重的性能问题能马上分析出原因,然后给出解决的思路并在不同因素中平衡,你必须要学好数据结构和算法。

(九)资讯库

打造属于自己的资讯库。

技术的发展是快速的,如果你不想被淘汰,那么应该始终对最新的技术和资讯保持一定的敏感度。

如果你要同时从多个网站,博客,公众号获取最新的知识,切换是一件很麻烦的事情,这里给大家推荐一个神器:

RSS

feedly 管理 rss, chrome 接收前端相关通知. rss 阅读器主动阅读其他领域知识