来自:Lam
https://zhuanlan.zhihu.com/p/265147335
https://zhuanlan.zhihu.com/p/223459952
前端现在个人觉得的一些现状 腾讯面经
困局
技术深度 - 试想你在每天都忙于处理各种紧急需求,各种老板需求,改各种因为没有在需求阶段就充分考虑就急忙上线导致的bug。你每天带着疲惫的身躯,回到家,能坚持去阅读源码,或者去各种论坛看技术文章的人有多少个,就算你能做到,你又能一直坚持多久,人不是机器,身心会疲惫。 技术广度 - 如果你在中小公司或者传统行业的公司中,你会发现,你的工作除了切图还是切图,或者做做小程序,用node的机会也只是用一下webpack。各种框架甚至都不会用,还在用jquery的公司不在少数。多端统一技术你压根就别想,特别现在的小公司,都是挂靠在各种平台中,微信,支付宝等。直接使用小程序进行开发,老实说,只写小程序的前端,压根就不是前端,本来在前端已经被框在浏览器中,而现在小程序进一步把前端框在小程序中。在这样的环境下,如何去扩展你的知识广度呢?
一个组件库,如果没有做到公司UI统一规范,产品经理和设计介入统一好样式和交互方式,你自己封装出来的组件只能算你自己弄的小工具罢了。另外一个组件库有没有相应的文档,demo等配套,提供给其他开发者,一个真正落地的专业组件库并没有你想象的简单。 监控系统,如果你没有结合后端,数据库和运维资源,压根你的监控系统根本搭建不起来。就算搭建起来,里面的功能是不是真的有意义,是不是确实能解决当前项目中的痛点盲点,我们自己有没有思考过,或者有牛人给你指点。 ........
没有好的学历和工作背景
你大概率去到中小型公司,或者创业公司和传统行业公司中搬砖
往往因为这类型的公司,更注重业绩和效率,对技术的建设忽视,导致你的工作时间和加班时间都是忙于搬砖。
在这类型的公司里面,往往身边的伙伴大概率来说相对平庸,所以氛围上没有形成一种积极的技术氛围。
如果你有想法,但是在公司的层面上因为注重的是业绩和效率,往往能提供的资源有限。
也正因为第三点的原因,所以没有很好的机会去提升自己的能力,加强技术深度,扩展知识广度。从而形成一种困局的局面,随着年龄的增长,想要突破现状进入大厂就越来越难。
破局
学历:首先学历是硬伤,已经毕业的你,没办法回到从前,但是在学历上我是如何破局呢?
如果你是大专,可以考个成人本科会有微微的帮助。起码可以让更多hr看你的简历。
其次,学历的硬伤也是面试需要靠很多运气比较大的成分,例如你现在面试大厂中的岗位,如果现在大厂非常需要人,而且有很多HC,那么你能成功跳过学历限制的机会就会大大提高,试想一下,如果现在你面试的部门只有1个HC,但是有一大群985,211的人挤过来,可能说你的能力比他们好,但是又不是说好非常多,那么你大概率得到的结果就是不通过。
多在各种社交平台,知乎,掘金等社区活动,认识多一些在大厂的人,和他们交流,得知一些内部招聘的岗位,HC等,会对你有针对性的去面试部门有帮助。ps:我在写知乎文章之前,我一个大厂的网友都没有,现在收获一批网友互相交流。
技术深度:我从前也是一个切图仔,每天忙着切图,没有多余的时间去学习,我的破局方法如下:
在一个公司待长一点的时间,利用时间的优势,积累对相关业务的熟悉程度,提高自己处理业务的能力,减少每个需求的处理时间,从而让自己空余出更多的时间可以对新技术的了解和深挖。(说白了就是在一个公司成为一名老油条,但是不要利用老油条的便利虚度光阴)
我在进腾讯前的公司,工作了4年多,已经是一名老油条了,对于业务上的事情,更多是处于一种协助和半管理的状态,更多是培养新人接手我手上的项目,释放自己的时间。
利用释放的这些时间和精力,去学习新技术,看别人的方案,以及利用自己多年在当前业务的经验,发现项目的不足和问题,通过技术的方式去解决(效率和质量),从而提高自己的技术能力和实践经验。
多封装和配置,例如,可以从后端接口获取的,不会自己写死在代码上,将需求抛给后端。重复使用的组件尽可能自己多学学封装组件,积累组件编写技巧以及封装技巧,对于技术深度有帮助。如果时间紧急,可以先使用第三方的库解决,但是要留意别人如何封装,然后转为自己编写。技术都是从点点滴滴积累起来的。
当你做到以上事情,那么你开发的速度将会提升,那么就可以挤出多一点的时间给自己有针对性的学习深度的知识。切勿看啥学啥,在各种平台上有五花八门的文章,但是要搞好前端的深度,必须深入了解一门框架的原理和思想,对浏览器的基础要了解,gc,渲染原理,前端的性能优化要加强学习,并且应用起来。
技术广度:作为前端,我们不能只停留在浏览器,必须学会跳出浏览器,主要就是后端和多端统一上。在我们当下的环境中,不一定有机会能应用到实际项目中,但是我们一定要多动手做demo(简历的项目中不要写自己做的demo作为项目,可以在你的技术技能中提及),对于使用以及基本原理和优化要有了解。
后端方向:以node作为切入点,学习koa,express的区别原理,如果你想进阿里,多用用egg,nest可以多期待。了解数据库,mysql和mongo即可。缓存方案redis。运行node,少不了nginx,了解一下如何做负载均衡。当然你也可以继续深入一点点,例如redis的缓存策略,击穿雪崩等解决方案,数据库的分表策略,索引机制,事务机制等,nginx的负责均衡策略等。个人建议:因为缺少实际项目,所以点到为止即可,要记住你是前端,这些技术更多是后端的技术,所以在有限的时间内不要过度深入(当然你有时间另当别论),更多是扩充知识而已,要深入可以日后根据方向继续深入。
网络:前端对网络的知识普遍都比较薄弱,多了解http不同版本的区别,特别是http1.1和2.0,https原理,tcp的链接方式,udp是什么等等。
多端统一方案:可以去了解一下react-native,flutter,taro等多端统一方案,做做demo,知道一下基本原理以及应用场景。
简历上有意思的项目:这个是需要考验你的综合实力了,因为你除了要有能力实现一些功能以外,还需要清楚的知道你现在想做的一些专项是为了解决什么问题,能否拿出数据,一般我们都是围绕2个点出发去提出技术方案,质量和效率。打个比方,组件库是提高质量和效率的,监控系统是提高质量的。这个需要你根据自己所在公司的业务,能否发现痛点,解决痛点,要学会用数据说话,提升了多少,覆盖率多少等等,让你的项目覆盖公司,这样你的项目才有意义。
跟对领导很重要,如果你的领导对于人员的培养很看重,愿意为团队争取资源,一定要好好珍惜,多沟通,多争取机会参与基础建设,那么对于自身能力提高会事半功倍。(需要看运气)
选对公司很重要,在没能进入大厂前,选择一个好的公司,好的技术团队,也是会让你事半功倍。(需要看运气)
腾讯云7面面经
一面-技术面
dom树节点和渲染树节点一一对应吗,有什么是dom树会有,渲染树不会有的节点 CSS会阻塞dom解析吗? requestIdleCallback是干什么用的 浏览器的渲染原理 浏览器的渲染过程 关键渲染路径详述 避免回流的方式 跨域的方式 前端的网络安全如何防御(xss,csrf) cookies的保护方式 浏览器的缓存机制 什么文件用强缓存,什么文件用协商缓存 React-Native的原理,优缺点 react的虚拟dom和diff描述 react渲染优化(class,hook) react的context的使用场景
mysql和mongo的区别,使用情景 node有什么情况会导致内存溢出 node的内存分配 event loop(浏览器和node)
首屏优化方案 在App中如何实现前端资源离线缓存(方案)
二面-技术面
浏览器的输入url后的过程 js异步方式 promise.resolve是干嘛的 promise.then如何实现链式调用 promise.then不返还一个promise还能用then吗 promise.finally的作用,如何自己实现finally promise原理 webpack的异步加载如何实现 webpack的分包策略 跨域方式有什么 jsonp的原理 csrf防御手段 cookie的samesite属性作用 js对象循环引用会导致什么问题 react如何阻止原生默认事件 react的fiber节点树是什么数据结构,为什么要用这样的数据结构 react 异步渲染原理,优先级如何划分 react hook有自己做一些自定义的hook吗 react key的原理 react如何实现函数式调用组件,toast.show() react新增了什么生命周和删除了什么生命周期,为什么要删除
node对于option请求如何处理 node如何处理cors跨域 ES modules和commonjs的区别 node的event loop和浏览器的区别 dns查询过程,dns用什么协议发起dns查询的 tcp和udp区别 tcp的三次握手和四次挥手 协商缓存和强缓存的区别 https协议握手大概过程 对称加密和非对称加密的区别 非对称加密,私钥和公钥的区别 https证书的作用
如何埋点,为什么用1*1像素的gif图片做上报 如何定义首屏
// 从pu克牌中随机抽5张牌,判断是不是一个顺子,即这5张牌是不是连续的。2~10为数字本身,A为1,J为11,Q为12,K为13,而大、小王为 0 ,可以看成任意数字。A 不能视为 14。
// 示例 1:
// 输入: [1,2,3,4,5]
// 输出: True
// 示例 2:
// 输入: [0,0,1,2,5]
// 输出: True
// 限制:
// 数组长度为 5
// 数组的数取值为 [0, 13] .
三面-技术面
绑定事件有多少种方式 事件触发的流程,捕获和冒泡 捕获阶段能终止吗 终止冒泡阶段有哪些 如果实现one绑定事件 事件委托的原理 event.target和event.currtager的区别 浏览器显示一个图片有什么方式 如何获取url中的?后的参数 浏览器的内存回收机制 标记清除还是引用计数? 如何解决跨域 什么是简单请求什么复杂请求 const和let有什么区别 ES6常用的api有哪些 数组断引用的方式有什么 Base64图片有什么问题
Http强缓存和协商缓存用的是什么字段,整体流程是怎样 Https原理 Https次请求会携带什么 Ca证书的内容是什么 Https2.0的特性 xss攻击原理的防御方式 Csrf攻击原理和防御方式 二进制分帧的具体是什么 Keep alive和多路复用的区别 Option请求的作用 Node gc方式 新生代和老生代的区别 新生代内存地址移动到老生代内存地址的过程
长列表优化方案 首屏优化方案 Node如何保证第三方接口的稳定性
四面-GM面
浏览器从写入url到加载完毕的流程 浏览器白屏原因 页面打开后cpu和内存快速增长,如何定位问题,可能有什么问题 长列表优化,以及长列表中,如果带搜索功能如何实现
五面-技术委员会技术面
满意的项目列举2个 为什么使用RN 有100匹马,场地只有4条跑道,得出快的4只马需要多少轮 Lam:100匹马,4个赛道,找出跑快的4匹马。 已知函数fn1会随机返回1-5的整数,要求基于fn1编写fn2,要随机生成1-7,fn2内不能使用系统的随机api,只能调用fn1获取随机数
六面-技术委员会技术面
前端的未来发展的一些思考 Serverless的优缺点,前端的应用范围 页面性能优化 做过的专项的架构图
七面-HR面
为什么离职 你现在公司有成就感的项目是什么 你现在公司有挑战的项目是什么,你是如果解决难题的 期望薪酬
总体感受
对JavaScript的Api可以手写。
bind
new
promise
.....
浏览器的加载原理,回流重绘,url输入后的流程,关键渲染路径等....
框架的原理,了解你常用的框架的内部原理以及实现,包括思想等。
浏览器和node的GC原理
浏览器和node之间eventLoop的区别
webpack的基本原理
数据库,redis,nginx的一些基本概念以及基本原理和优化。
对于前端页面的优化方案,包括首屏加载,资源整合,网络优化,长列表优化等
网络安全,xss,csrf,cookies保护等
网络知识
tcp
https和http
dns
udp
算法和数据结构
基本常用排序
链表操作
树结构操作
贪心算法
回溯算法
双指针操作
哈希表
动态规划(一般为加分题)