2020/7/6
Web前端开发高级工程师（课程大纲-第三版） 1/7
阶段一：JavaScript核心运行机制与实战开发
JS第一座大山：堆栈内存和闭包作用域
9种数据类型区别及相互转换
词法解析和变量提升
堆（Heap）栈（Stack）内存及垃圾回收机制
JS底层运行机制：EC/AO/VO/GO
作用域（Scope）和作用域链（Scope-Chain）
闭包及其两大作用：保存/保护
高阶编程：惰性函数/柯理化函数/compose组合函数
BAT/TMD经典面试题深入剖析
jQuery源码解读 [ 基本骨架 ]
Lodash源码解读 [ 函数防抖和节流等 ]
JS第二座大山：面向对象（OOP）程序设计
全方位剖析面向对象程序设计
构造函数（constructor）和 new 底层实现机制
原型（prototype）和原型链（proto）
函数3种角色及Function/Object的相互依赖机制
BAT/TMD经典面试题深入剖析
This的5大场景及实战应用
call/apply/bind/instanceof/Object.create等源码剖析
JS中4大继承方案的深入解析
jQuery源码解读 [ 数据类型检测的封装及底层核心 ]
Lodash源码解读 [ 数组/对象的深拷贝和深比较 ]
JS第三座大山：同步异步编程及浏览器渲染机制
浏览器底层渲染机制
DOM树/CSSOM树/RENDER树
DOM的回流（Reflow）重绘（Repaint）及实战应用
同步（Sync）异步（Async）编程
事件循环（EventLoop）和事件队列（EventQueue）
微任务（Microtask ）和宏任务（Macrotask ）
CRP关键节点性能优化（Critical Rendering Path）
页面白屏优化之骨架屏技术（Skeleton）
BAT/TMD经典面试题深入剖析
JS第四座大山：DOM事件及设计模式
详细解读事件及事件对象
DOM2级事件的核心运行机制
事件传播机制和事件代理
2020/7/6 Web前端开发高级工程师（课程大纲-第三版）
jQuery源码解读 [ JQ中的事件库 ]
观察者（Observer）和发布订阅（Pub-Sub）设计模式
单例（Singleton）和工厂（Factory）设计模式
代理（Proxy）和装饰（Decorator）设计模式
从零实现开源级插件组件封装
BAT/TMD经典面试题深入剖析
京东放大镜、B站楼层导航、百度可拖拽登录框等10多个经典案例
JS第五座大山：ES6+核心知识和源码分析
let/const和var的区别
箭头函数和普通函数的区别
class类和类的装饰器（Decorator）
Set/Map/WeakSet/WeakMap
Promise 和 Promise A+ 规范源码
async/await及内部实现原理
Generator生成器和Interator迭代器
模块化发展历程：AMD、CMD、CommonJS、ES6 Module
Object.defineProperty和Proxy深度对比
函数式编程和命令式编程
JS第六座大山：AJAX/HTTP前后端数据通信
HTTP1.0和HTTP2.0的区别
HTTP和HTTPS的区别
TCP的三次握手和四次挥手
DNS及DNS预解析（dns-prefetch）
强缓存（Expires / Cache-Control）和协商缓存（Last-Modified / ETag）
HTTP报文和HTTP网络状态码
XMLHttpRequest及内部核心操作
数据传输格式：FormData / x-www-form-urlencoded / raw / binary
Axios库及Axios的二次配置
基于Promise从零封装Axios库
Fetch及Fetch库的封装
N种跨域解决方案及底层原理
前端性能优化方案汇总（全面深入分析+实战演练）
进阶专题1：数据结构与算法
堆 / 栈 / 队列 / 优先级队列
链表 / 反向链表 / HASH / 二叉树 / 红黑树
大O标识法和时间复杂度
N种排序算法的详细分析
N种去重算法的详细分析
递归算法及深度优先 / 广度优先
BAT/TMD算法原题剖析
持续性更新算法题库（Leet-Code和大厂原题）
进阶专题2：H5及响应式布局开发
maxiang.io 2/7
2020/7/6 Web前端开发高级工程师（课程大纲-第三版）
响应式布局方案：@media/rem/flex/vw/vh
layout viewport 与 visual viewport 与 dpi 适配
音频（audio）和视频（video）处理方案
移动端Touch事件及事件库封装
FileReader文件系统及实战应用
Swiper框架及实战应用
实战案例：创意H5场景交互案例
进阶专题3：Canvas和数据可视化
canvas基础用法及图像处理
svg的基本用法
canvas动画及小游戏开发
基于canvas实现QQ头像的裁切和上传
webGL / three.js基础及实战应用
Echarts基本用法及在使用时需注意的点
echarts实战多元化/个性化数据图表练习
进阶专题4：正则表达式深入剖析
正则表达式中的元字符和修饰符
正则匹配及常用正则表达式编写
正向预查和负向预查
正则捕获的懒惰性和贪婪性
exec / match / replace 的底层实现原理
实战案例：queryURLParams、千分符、时间格式化等
BAT/TMD经典面试题深入剖析
进阶专题5：企业OA办公管理系统
登录注册的前后端处理机制
加密策略：encodeURIComponet / MD5等
存储方案：cookie / webStorage / session等
用户权限和登录态的校验处理
Token 及 JWT 的校验处理
项目实战开发技巧及性能优化
进阶专题6：电子商城Hybrid混合APP
Hybrid混合APP开发
JSBridge通信机制和底层原理
微信JS SDK
基于Hbuilder实现APP打包
移动端联调处理方案
项目实战开发技巧及性能优化
阶段二：Vue/React/Webpack核心知识与实战开发 3/7
2020/7/6 Web前端开发高级工程师（课程大纲-第三版）
第一部分：Webpack工程化开发与部署
webpack核心基础知识
单(多)入口项目打包
webpack devServer 和 Proxy代理
loaders及plugins的处理
CSS样式的抽离、压缩、兼容性处理
less/sass等预编译语言的处理
基于babel转换ES6/ES7语法及Polyfill兼容处理
resolve / sourceMap
webpack性能优化（TreeShaking、CDN加载、热更新、图片压缩等）
vue-cli3.0脚手架的应用/配置和性能优化
vite / snowpack 基础语法和实战应用
第二部分：Vue2.0的基础知识与核心原理
mvvm 双向数据绑定实现的原理
dom-diff 及其实现原理
v-model 及其实现原理
template模板语法和render JSX语法
受控组件（data）和非受控组件（ref）
属性及属性的校验规则
常用的指令和Vue.directive自定义指令
watch 与 computed 的深度对比和实现机制
事件处理及修饰符
表单元素和条件及循环渲染
vue transition动画和路由切换动效
生命周期（钩子）函数及实战应用
Component组件化开发及slot插槽
实战案例：淘宝商城购物车信息管理
第三部分：Vue生态及进阶（vuex / vue-router）
复合组件信息通信的6大方案
emit 自定义事件
vuex基础：state/getter/mutation/action
vuex的模块化管理和mapXxx遍历
mixin混入和Vue.use插件开发
vuex的核心源码解读
SPA（单页面应用）和MPA（多页面应用）对比
HASH路由和BROWSER路由对比
编程式导航和动态路由
路由导航守卫及权限校验
keep-alive组件静态/动态缓存
vue-router核心源码解读
实战案例：TASK OA任务管理系统
第四部分：Vue综合实战和性能优化
maxiang.io 4/7
2020/7/6 Web前端开发高级工程师（课程大纲-第三版）
element-ui / cube-ui / vant 实战应用和二次封装
从零开始封装专业级的UI组件
Vue-DevTools 调试工具与单元测试
长列表和无限列表性能优化方案
基于 babel-plugin-component 实现组件按需导入
图片 / 路由 / 数据 等资源的懒加载
loading / 骨架屏等优化技巧的实战应用
webpack编译打包层面的优化处理
CSRF / XSS 等方面的网络安全优化处理
综合实战案例
基于Vue + Vue-Router打造今日头条客户端
基于Vue + VantUI/CubeUI开发知乎日报APP
基于Vue + Vuex开发QQ音乐播放器
基于Vue + Vuex + Vue-Router 开发网易云音乐
[大型实战] 珠峰在线课堂APP
[大型实战] 企业级OA办公管理系统
……
第五部分：Vue3.0基础知识与实战应用 5/7
全方位深度对比 vue2 和 vue3 的区别
vue3新特性全面剖析
基于vite / webpack实现vue3工程化部署
掌握setup和10种响应式系统API
掌握新生命周期函数和模板refs的使用
vue3中的响应式系统和dom-diff
基于vue3实现知“乎日报App”开发
这部分内容会伴随着vue3及其生态的更新而不断更新
第六部分：React基础知识与核心原理
create-react-app脚手架的应用与优化
jsx的基础知识和实战应用
虚拟DOM到真实DOM的渲染原理
react中的dom-diff实现原理
属性和状态的管理（深入剖析setState的同步异步）
受控和非受控组件
react合成事件和双向数据绑定
函数式组件及React Hooks
类组件及其生命周期函数（Component VS PureComponent）
复合组件和组件嵌套
基于属性实现父子组件信息通信
基于上下文（React.createContext）实现组件信息通信
第七部分：React生态及进阶（redux / react-router-dom）
2020/7/6 Web前端开发高级工程师（课程大纲-第三版）
redux的操作流程和实战应用
react-redux的实战应用和中间件处理
高阶组件（代理组件）及其实现原理
redux / react-redux / 中间件 源码解读
Dva 和 UmiJS 及其实战应用
react-router-dom的基础常规操作
withRouter高阶函数
编程式导航和动态理由
实战案例：TASK OA任务管理系统
第八部分：React综合实战和性能优化
从零开始封装专业级的UI组件
Ant Design UI库的应用和二次封装
axios / fetch 二次配置和API接口模块化管理
第三方登录和支付功能
Code Splitting 代码“懒加载”
shouldComponentUpdate 与 PureComponent
列表类组件优化处理技巧
基于Immutable.js进行性能优化
react-addons-perf 性能监测
大型实战案例：小米有品电商APP
进阶专题1：微信小程序开发
小程序注册和IDE
rpx适配、模板使用、图片处理等
小程序中核心组件/API的应用
导航及列表渲染（包含无限渲染）
HTTP-PROMISE及和服务器的交互处理
获取用户信息及地理位置
小程序中的支付处理
mpvue框架的实战应用
uni-app框架的实战应用
大型实战案例：美团商城小程序开发
进阶专题2：全面贯穿node.js/express全栈开发
node的安装和npm包管理器
fs内置模块和PromiseFS封装
http内置模块和搭建web服务器
搭建数据服务器和实现Restful API规范的接口
Express框架基础知识
Express中路由和中间件的实战应用
Koa2框架基础知识
数据Mock和MongoDB数据库应用
实战案例：小米有品电子商城APP的Node后台开发
实战案例：企业级OA办公管理系统的Node后台开发
maxiang.io 6/7
2020/7/6 Web前端开发高级工程师（课程大纲-第三版）
进阶专题3：GIT团队协作开发
Git的简介和安装
集中式(SVN) 和 分布式(GIT)的对比
工作区、暂存区、历史区、远程仓库
历史回滚和差异对比
和远程仓库的信息同步
Git分支处理
分支合并和冲突处理
玩转GitHub和构建个人博客
进阶专题4：TypeScript 及 Flutter
TypeScript的安装和编译
数据类型 / 函数 / 类
接口 / 泛型 / 类型变换
模块 VS 命名空间
TypeScript的工程化处理
Flutter dart语法及环境配置
Flutter常用组件和布局
Flutter导航和动画处理
Flutter版珠峰课堂项目实战
附赠：就业指导和职业规划
阿里九段人才培养方案中各级别的要求
教你编写出一份优秀的个人简历
十多年心血汇总：“面试必杀绝技”
大厂面试流程和侧重点
如何才能成为一名优秀的IT工程师
企业内推资源和一对一模拟面试
学完本套课程体系，则具备阿里P5+级别的开发能力，能够基于vue/react/小程序等独立开 发出企业级的实战项目（毕业标准：独立完成一套毕设项目，并交由老师审核通过）
maxiang.io 7/7
