进军高级前端开发工程师必备的知识图谱

一、前沿

全文（含脑图）为个人总结的关于高级前端开发工程师必备的技术能力，欢迎补充。全文结构如下：
前沿：写在正文前的一些话。
脑图：基于知识图谱的脑图，看知识图谱晕的可以欣赏脑图。
知识图谱：脑图无法下手的，参照一下知识图谱。

二、脑图

PS：建议单击图片，点击图片下方的查看原图，放大图片后，再进行脑图的查看

三、知识图谱

• 1.核心技术

  • 1.1 HTML(5)

  • 1.2 JavaScript

    • ES6
    • Vue
    • React
    • Angular

  • 1.3 CSS(3)

    • 布局

      • 基础布局
      • 双飞翼布局
      • 圣杯布局
      • Flex布局
      • Grid布局
    • CSS3D
    • 矩阵
    • 高性能渲染
    • Houdini

• 2.扩展技术

  • 2.1 后端（至少一种）

    • Node.js

      • 核心API
      • Express
      • Koa
      • Egg
      • 微服务
      • C/C++
    • PHP
    • Go
    • Java

  • 2.2 移动端

    • AMP
    • PWA
    • Flutter

  • 2.3 图形学

    • SVG
    • Canvas
    • Cocos2d
    • WebGL
    • Three.js
  • 2.4 TypeScript
  • 2.5 浏览器特性/兼容性

• 3.工程开发

  • 3.1 预编译工具

    • Less
    • Sass
    • PostCss

  • 3.2 构建工具

    • Webpack
    • Grunt
    • Gulp

  • 3.3 性能优化

    • FCP
    • FMP
    • 客户端渲染
    • 服务端渲染
    • 雅虎军规
    • ...

  • 3.4 版本管理

    • Git

  • 3.5 高级调试

    • 断点
    • Timeline
    • Profiles

  • 3.6 自动化测试

    • Karma
    • Mocha
    • Jest

  • 3.7 可用性/安全

    • 加密
    • 混淆
    • ...

• 4.编程思想

  • 4.1 编程范式

    • 面向对象编程
    • 函数式编程
    • 响应式编程
    • 面向切面编程
    • ...

  • 4.2 设计模式（至少掌握最热门的前5种）

    • 1.单例模式
    • 2.代理模式
    • 3.命令模式
    • 4.发布订阅模式
    • 5.职责链模式
    • ...

  • 4.3 设计法则

    • 单一职责原则
    • 开放封闭原则
    • 李氏置换原则
    • 接口独立原则
    • 依赖导致原则

  • 4.4 架构模式

    • MVC
    • MVP
    • MVVM
    • Flux
    • ...

  • 4.5 算法

    • Diff算法

    • 排序算法

      • 冒泡排序
      • 选择排序
      • 插入排序
      • 希尔排序
      • 归并排序
      • 快速排序
      • ...

    • 检索算法

      • 二分法
      • ...

  • 4.6 编程原理

    • v8
    • libv
    • ...

• 5.能力

  • 5.1 学习能力
  • 5.2 技术能力

  • 5.3 专长（在专业领域解决问题）

    • 前端
    • 后端
    • 移动端
    • 图形学
    • 算法
    • ...

  • 5.4 认知能力

    • 业务理解
    • 需求分析
    • 项目评估

  • 5.5 经验

    • 项目经验
    • 使用经验（问题解决方案）
    • （跨）领域经验
    • 管理经验

  • 5.6 架构能力（核心：判断和取舍）

    • 性能
    • 可用性
    • 伸缩性
    • 扩展性
    • 安全性

更新日期：2019年1月