Tree

基础知识

• js & ts
  • 常用数据结构
    • Map
    • Object
    • Array
    • Class
  • 原型和原型链
  • 继承
  • 深拷贝、浅拷贝
  • js 创建对象的几种方式
  • ts
• html
  • h5 新特性
• css
  • 动画
  • 经典问题：圣杯布局，垂直居中布局
• es6
  • 箭头函数（this 指向问题）
  • let var const 区别
  • 字符扩展
  • class 和继承
  • promise
  • 数组方法
• SVG/Canvas

=> 底层

• 计算机基础知识

  • 数据结构与算法
  • 计算机网络
  • 操作系统
  • 组成原理
  • 编译原理

• 浏览器

  • 浏览器内核

• dom

• node v8 引擎

=> 高级扩展

• js ts 装饰器、注解
• dart

node 全栈

• 前端框架&工具
  • angular
  • vue
    1. 双向数据绑定原理
    2. 监听原理
    3. diff 算法
  • react
  • jQuery
• 中间件
  • graphql
• 后端框架
  • express
  • koa
  • nest
  • egg

系统架构

• 前后端分离模式

• 前后端交互方式

  JSON http 等

• 单点登录 认证方式 实现方式 原理

• 一名【合格】前端工程师的自检清单

NetWork

• TCP UDP
• http
  • xhr
  • fetch()
• websocket
• http/1.1 http/2
• http https
• QUIC http/3.0

Build & Deploy

• 构建
  • webpack
  • gulp
  • grunt
  • bazel
• 压缩合并
  • UglifyJs
• 发布
  • nginx
  • caddy
  • docker

Version Control

• git
• svn

开发环境&工具

• linux 常用命令
• Windows 常用命令 & 工具
• VS Code 插件 & 快捷键
• 调试工具
  • chrome Dev Tools
  • Fiddler

代码质量&安全

• 单元测试
• coding style
  • csslint
  • jslint
• CSRF/XSS
• same-origin policy

前端标准规范&性能优化

• commonJS Modules/AMD
• es6/es7
• esnext
• ivy
• pageSpeed
• 组件化
  • 工程组件化
  • 业务逻辑模块化

---