Learn Tips
1. 掌握图形学, webgl或熟练使tree.js框架, 熟练canvas相关的渲染及动画操作的优先.
初级:
1. 学习过图形学相关知识, 知道矩阵等数学原理在动画中的作用, 知道三维场景需要的最基础的构成, 能用threejs搭建3d场景, 知道webgl和threejs的关系.
2. 知道canvas是干嘛的, 聊到旋转能说出canvas的api.
3. 知道css动画, css动画属性知道关键字和用法.
4. 知道js动画, 能说出1~2社区动画库, 知道js动画和css动画优缺点以及运用场景.
5. 知道raf和其他能达到60fps的方法
2. 熟练掌握JavaScript[javascript语言精粹]
知道class继承和组合寄生继承的差别, 举例说明
知道eventloop原理, 知道宏微任务, 并且能从个人理解从面说出为什么要区别.
能将继承, 作用域, 闭包, 模块这些概念融会贯通, 并且结合实际例子
能脱口说出两种以上设计模式的核心思想
掌握一些基础的算法核心思想
3.熟练掌握工程化工具, 掌握模块化思想和技术实现方案
初级:
知道webpack, rollup以及他们的使用场景, webpack v4和v3的区别, webpackde基本配置
知道webpack打包结果的代码结构和执行流程
知道amd commonjs, es module, cmd
中级:
知道webpack打包链路, 知道plugin生命周期, 知道怎么写一个plugin和loader
知道loader做了什么, 能几句话说明, 比如babel-loader, vue-loader
能结合性能优化聊webpack配置怎么做, 能清楚说明核心要点有哪些, 并说明解决说明问题, 需要哪些依赖, 比如cdn, 接入层等
了解异步模块加载的实现原理, 能口喷代码实现核心逻辑
高级[能设计出或具体说明团队的研发基础设施]:
项目脚手架搭建及如何以工具形态共享
团队eslint规范如何设计， 及如何统一更新
工具化打包发布流程, 包括本地调试, 云构建, 线上发布系统, 一键部署能力.
4. 熟练掌握React前端框架, 了解技术底层. 同时了解vue等其他框架.
初级:
知道React常见优化方案, 脱口而出常用生命周期
知道React大致实现思路, 对比react和js控制原生DOM的差异, 实现一个建议react
对state和props有自己的心得, 结合受控组件, hoc等特性描述, 需要说明方案的使用场景
中级:
说明fiber以及可能带来的坑
说明hook
说明immutable
知道react不常用的特性, 比如context, protal
5. 熟练掌握react生态常用工具, redux/react-router等
知道核心实现原理和底层依赖
能从数据驱动角度痛彻的说明redux, 能够口喷原生js和redux结合怎么做
能结合redux, vuex, mobx等数据流谈谈自己对vue和react的异同
基于全家桶构建的复杂应用
6. 熟练各种web前端技术, 包括HTML/XML/CSS等, 有基于Ajax的前端应用开发经验
初级:
HTML方面包括但不限于: 语义化标签, history api, storage, ajax2.0等
css方面包括但不限于: 文档流, 重绘重排, flex, BFC, IFC, before/after, 动画, keyframe, 画三角, 优先级矩阵.
能口喷xhr的用法, 知道网络请求的相关技术和技术底层
知道如何完成登陆模块, 包括但不限于: 登录表单如何实现; cookie登录态维护方案;token base登录态方案;session概念;
中级:
HTML方面能够结合各个浏览器api描述常用类库的实现
css方面能够结合各个概念, 说明网上那些hack方案或优化方案的底层
能说明接口请求的前后端整体架构流程, 包括: 业务代码, 浏览器原理, http协议, 服务端,接入层, rpc服务调用, 负载均衡
知道websocket
知道pc端与移动端登录态维护方案, 知道token base登录态实现细节
知道oauth2.0 轻量与整体实现方案
高级:
考虑mock方案的通用性, 场景覆盖度, 以及代码或工程侵入程度
埋点方案
7. 良好的编码习惯, 对前端技术有持续的热情
知道eslint, 以及如何与工程配合使用
遇到不会的题目, 可以从逻辑分析上给出大致的思考路径
面试官给出关键词可以快速反应出相关的技术要点
知道TS是什么, 为什么使用TS, 有TS工程化实践经验
知道移动端常见问题, 包括但不限于: rem+1px方案, 预加载, jsbridge原理等.
