前端从小白到架构师的成长之路（持续更新中...）

梳理下作为前端架构师应该掌握的知识技能，方便自己能一步一步的成长为架构师。
技能掌握程度自查列表

CSS

推荐两本书，1.《CSS世界》、2.《CSS揭秘》 先后看完这两本书，对提升css技术有很大帮助

• 命名建议与约束
• CSS选择器
• CSS权重
• 浏览器的兼容性解决方案
• 响应式布局方案
• 对css渲染性能的思考
• 合理使用css预处理：scss、less
• 图片的细节处理
• 图标的选择
• 动画与交互，对用户体验的思考
• CSS计算属性

看详情点我《前端技能自查——CSS》

HTML

• 语义标签的意义
• 块元素、行元素、伪元素
• 元素自带的特殊属性

SVG

• 矢量图形的绘制
• 线、圆、多边形的绘制
• 鼠标事件的处理
• 图形放大缩小

Canvas

• echarts 的实现原理
• 定时器实现动画
• 自适应宽高
• 图片转二进制
• 缓存技术，提高动画性能

JavaScript

《JavaScript权威指南》必读

• ES6 新特性
• this的4种写法
• 变量的作用域
• 对象原型链
• JavaScript 编译机制（至少编译两次）
• JavaScript 程序执行顺序
  看详情点我《前端技能自查——JavaScript》

TypeScript

• 类型推断
• 泛型的使用
• 类型的定义声明
• TSC编译机制
• 对于Vue的props属性如何配置

HTTP

• HTTP协议、TCP三次握手
• HTTP响应码
• 跨域
• request
• response
• cookie
• session

Eslint

• 配置文件说明
• vscode应用
• 错误告警检查与快速修复
• 业界主流的约束有哪些？必须的规范有哪些？

交互

SEO

安全

• XSS攻击
• SQL注入

CDN与DNS负载均衡

• CDN配置
• 什么是DNS
• 负载均衡如何部署配置

leetcode算法

• 数组
• 链表
• 二叉树
• 回溯算法
• 双指针
• 动态规划

浏览器内核与加载机制

• 一次最多6次请求限制
• 各个浏览器之间有何不同
• 目前浏览器内核用户占有率

浏览器API

• 性能检测API
• dom加载相关的API

V8引擎

Tree Shaking

单元测试

• 测试管理工具 karma
• 测试框架 Mocha、jest
• 断言库 sinon-chai
• 测试浏览器 PhantomJS、Headless Chrome

rollup

webpack

vite

Node

Vue

微信小程序

React

Electron 桌面应用

Linux

Java