知识体系

CSS

• flex
• zIndex
• 居中

• 双飞翼 圣杯布局

  基础JS

  javascript面试题目
  重学前端

• 异步

• 闭包
• 继承-类
• 数组基本方法
• 防抖、截流（请求乱序问题）
• Promise手写，Promise.all手写
• ES6、7、8、9新特性
• Typescript
• 回调的演变历史 地狱 => yield => async/await(手写源码)
• apply、bind、箭头函数/function this
• ajax和fetch区别
• DOM BOM 事件代理冒泡

React

• setState源码
• diff算法
• fiber
• virtual dom
• 顶层api eg. createElement、cloneElement、memoize等
• 新老生命周期及对比优劣
• Hooks 常见api使用 底层原理 https://www.bilibili.com/video/BV1iV411b7L1
• vs Vue

Redux

React Router

• 基本使用

• 原理源码

  Webpack

• 依赖图生成

• plugin手写、loader手写
• 常用的plugin、loader
• 打包优化
• 模块规范支持（AMD、ES6等）
• 热更新原理
• 性能优化

• https://km.sankuai.com/page/783819755 从零开始搭建React项目

  网络

  

• nginx

• web socket
• http2 & 怎么切换到http 2 from 1.1
• http3
• 网站的网络方面优化
• 路由、桥、网关，vpn
• 正向代理和反向代理
• jwt sso oauth（扫描登陆场景、单点登录场景、服务端认证）

[

](https://juejin.cn/post/6844904100035821575)
**灵魂TCP系列: https://juejin.cn/post/6844904070889603085
灵魂HTTP系列: https://juejin.cn/post/6844904100035821575

浏览器

• 浏览器的runtime
• 渲染
• 跨域 https://github.com/qufei1993/http-protocol/blob/master/docs/cors.md
• eventloop事件轮询 vs Node事件轮询
• 缓存
• node v8无头引擎和浏览器引擎的区别
• v8引擎原理 图解V8
• 面板系列 network、performane等

https://github.com/lyn-jz/front_end_note/blob/master/other/%E5%9B%BE%E8%A7%A3GoogleV8.md

性能优化

算法

• 排序

• 数据结构：树（平衡树 b+ 红黑等）、队列、链表、堆

  操作系统

• Linux常用命令

• 调度策略
• 
  

React Native

模块化 es规范等

babel

安全

XSS、CSRF

新技术

• web worker
• web socket
• electron桌面应用 （可选）
• 微信小程序 （可选）
• canvas WebGL （可选）

• Serveless （可选）

  工程相关

• husky

• mock
• 微前端
• 自动化
• vscode插件 提效工具（vscode code snippet）
• 大文件上传

• docker CI CD

  
  

  算法-每日必刷

  参考：算法小抄pdf

Node - 专攻1

学习链接：
https://www.nodejs.red/#/README【推荐】
http://nodejs.cn/learn/nodejs-streams
http://javascript.ruanyifeng.com/nodejs/basic.html

Koa-专攻2

https://chenshenhai.github.io/koa2-note/

1 Node概览
1.1 为什么要用Node？
1.2 为什么要前后端分离？
1.3 Node的架构分层，各层功能？
1.4 Node核心模块有哪些？
2 Node全局对象
2.1 Node全局对象有哪些?
2.2 console常用方法有哪些?
2.3 Node定时功能有哪些?
2.4 Node中的事件循环
2.5 Node中的Buffer应用场景?
3 EventEmitter
3.1 什么是EventEmitter?
3.2 如何实现一个EventEmitter?
3.3 EventEmitter的典型应用有哪些?
3.4 如何捕获EventEmitter错误事件
3.5 EventEmitter中的newListenser事件有什么用处?
4 Stream
4.1 什么是Stream?
4.2 Stream有什么好处?
4.3 Stream典型应用有哪些?
4.4 怎么捕获Stream的错误事件?
4.5 常用Stream有哪些，分别什么时候使用?
4.6 如何实现一个Writable Stream?
5 文件系统
5.1 内置的fs模块架构是什么样子的?
5.2 读写一个文件有多少种方法?
5.3 怎么读取json配置文件?
5.4 fs.watch和fs.watchFile有什么区别，怎么应用?
6 网络
6.1 Node的网络模块架构是什么样子的?
6.2 node是怎样支持https、tls的?
6.3 实现一个简单的http服务器?
7 child-process
7.1 为什么需要child-process?
7.2 exec、execFile、spawn和fork都是做什么用的?
7.3 实现一个简单的命令行交互程序?
7.4 两个node程序之间怎样交互?
7.5 怎样让一个js文件变得像linux命令一样可执行?
7.6 child-process和process的stdin、stdout、stderror是一样的吗?
8 node高级话题(异步，部署，性能调优，异常调试等))
8.1 node中的异步和同步怎么理解
8.2 有哪些方法可以进行异步流程的控制?
8.3 怎样绑定node程序到80端口?
8.4 有哪些方法可以让node程序遇到错误后自动重启?
8.5 怎样充分利用多个CPU?
8.6 怎样调节node执行单元的内存大小?
8.7 程序总是崩溃，怎样找出问题在哪里?
8.8 有哪些常用方法可以防止程序崩溃?
8.9 怎样调试node程序?
9 常用知名第三方类库(Async, Express等))
9.1 async都有哪些常用方法，分别是怎么用?
9.2 async.parallel并行执行完多个函数后，调用结束函数
9.3 express项目的目录大致是什么样子的
9.4 express常用函数
9.5 express中如何获取路由的参数
9.6 express response常用方法有哪些
9.7 Koa框架
9.8 Koa 与 express 区别在哪
9.9 Koa如何实现在context上也能使用context.request 的许多属性？
10 配置相关
10.1 package.json中版本号如何限定？

面试题链接集锦

https://github.com/paddingme/Front-end-Web-Development-Interview-Question
https://github.com/qiu-deqing/FE-interview
https://github.com/lgwebdream/FE-Interview