第一章、工程化場景分析
前端工程化發展歷史?
前端工程化的應用場景?
前端工程化關鍵技術之模塊化詳解?
CommonJS規范詳解?
ESModule規范詳解?
npm+webpack原理
第二章、Webpack 源碼分析
webpack 基本使用代入?
webpack 打包文件分析?
webpack ast語法分析?
webpack
load核心機制分析?
webpack
pulgin 核心分析?
webpack 依賴模塊編譯流程?
手寫簡易webpack?
第三章、HMR原理解析——Vue-Cli核心源碼解析
核心中間件：webpack-dev-middleware實例化源碼解析
devMiddleware中間件核心處理邏輯解析
深入講解HMR實現原理?
hotMiddleware源碼執行流程詳解?
HMR客戶端實現原理詳解
vue-cli構建源碼流程梳理
第四章、Webpack 性能優化
webpack性能優化原理和目標?
深入分析構建速度測量插件speed-measure-webpack-plugin?
深入分析構建體積檢測插件webpack-bundle-analyzer?
構建性能優化之多進程thread-loader
分包文件拷貝和模板的自動引用
image-webpack-loader實現圖片5倍壓縮?
purgecss-webpack-plugin優化css體積
第五章、前端工程化腳手架設計
深入腳手架的實現原理
腳手架開發流程介紹?
快速搭建腳手架和腳手架本地調試方法
腳手架參數解析方法封裝?
腳手架自動化測試流程講解和腳本開發
文件類型+權限自動化測試腳本開發
第六章、Vite 從入門到精通
Vite 概要介紹
Vite 基礎應用
Vite 高級應用
Rollup 系統學習
Vite 插件系統講解
實戰 Vite
插件
Vite
源碼解析
第七章、JS 版數據結構與算法
數組與對象?
棧 與隊列?
鏈表?
集合?
字典與散列?
遞歸?
樹?
二叉堆與堆排序
圖
第八章、經典算法案例分析
動態規劃
貪心算法
回溯算法
排序搜索算法?
第九章、瀏覽器工作原理與實踐
什么是瀏覽器?
瀏覽器中的 JavaScript 執行機制?
V8
工作原理?
瀏覽器中的頁面事件循環系統?
瀏覽器中的頁面?
瀏覽器中的網絡?
瀏覽器安全
第十章、編譯原理
計算機理論引導?
編譯原理概述?
編譯原理詞法分析?
編譯原理語法分析?
編譯原理語法制導翻譯?
編譯原理程序運行環境
第十一章、Vue2 核心源碼分析
源碼運行環境準備?
入口打包文件分析?
vue2.6
特性分析?
全局api分析與實現?
數據驅動與掛載流程分析?
響應式原理-對象依賴收集?
響應式原理-數組依賴收集
第十二章、Vue3 核心源碼分析
源碼運行環境準備?
入口打包文件分析?
vue3.0
新增特性分析?
全局api分析與實現?
數據驅動分析?
組件化分析?
響應式原理分析
第十三章、Vue常用插件原理分析與實現
如何實現前端路由vue-router?
如何如何實現Vuex?
常用指令v-lazy原理與實現?
vue如何實現服務端渲染
第十四章、React設計哲學與深度源碼分析
react源碼的獲取與環境搭建?
基礎api簡述?
Fiber
Scheduler?
組件更新機制?
dom更新機制?
suspense and
priority
第十五章、深入 React-Hooks 工作機制
什么是Hooks以及他的用法?
Hooks的定義以及執行前后的準備和重置?
useEffect和useLayoutEffect的實現原理和區別?
useState的實現原理和注意事項?
其他常用hook的使用與分析
第十六章、React中的 Fiber
React 中的“棧調和”（Stack Reconciler）過程是怎樣的？?
如何理解 Fiber 架構的迭代動機與設計思想？?
剖析 Fiber 架構下
Concurrent 模式的實現原理
第十七章、版本管理
SVN VS Git 優缺點?
掌握Git基礎命令?
Git進階命令：rebase，reset，stash?
從零配置 github 到 SSH
秘鑰克隆倉庫?
Git Flow及管理版本控制?
使用 Docker 快速搭建 gitlab 平臺?
docker-compose 集成化的
docker
命令?
gitlab 平臺與 gitea 平臺比較
gitlab 平臺管理，用戶權限控制
第十八章、運維基礎
linux系統操作基礎?
docker使用與實戰?
了解Linux運維相關的命令與知識?
了解私有化容器平臺搭建及使用
第十九章、自動化部署
了解CI/CD平臺CircleCI，TravisCI和Jenkins?
理解自動化/持續集成流程，升華DevOps理解?
快速搭建、配置Jenkins服務?
掌握Jenkins中的權限控制，并與gitlab進行集成?
學習Jenkins的權限控制與插件管理系統?
配合Jenkins效率構建，完成發布、構建等工作?
實戰前端項目自動化部署
第廿章、前端“輪子”工程
組件庫思想(以組件化方式考慮UI構建)?
封裝表單組件&需要注意的點(通用性、易用性)?
通用業務組件庫react +
vite模板（集成測試、格式化、日志）?
組件庫的樣式方案?
組件庫色彩設計?
基礎組件（按鈕、圖標）設計?
功能組件菜單組件設計?
React與Vite項目配置?
vue-protable組件分析?
實現vue-protable組件?
虛擬列表分析與實現?
組件庫文檔編寫
第廿一章、Vscode 插件開發
vscode插件工作原理解析?
vscode插件api解析?
代碼提示工具 “sloth” 樹懶需求場景分析?
sloth
插件實現?
sloth插件發布vscode商店?
工具插件前景展望與需求定制
第廿二章、Chorme瀏覽器插件開發
Chrome插件工作原理解析?
chrome插件api解析?
圖床功能chrome插件需求分析?
sloth
插件實現?
工具插件前景展望與需求定制
第廿三章、Webpack 加載器與插件開發
快速定位元素代碼需求分析?
webpack自定義loader開發?
webpack自定義plugins開發?
集成發布npm平臺
第廿四章、性能優化的指標和工具
為什么要進行Web性能優化?
前端性能瓶頸分析
性能優化常見指標?
RAIL測量模型?
使用WebPageTest評估Web網站性能?
性能分析工具對比Profiler、Developertools、Performance，
LightHouse
第廿五章、渲染優化
瀏覽器渲染原理和關鍵渲染路徑?
回流與重繪, 如何避免布局抖動?
使用FastDom?
高頻事件防抖
第廿六章、代碼優化
JS開銷和如何縮短解析時間?
配合V8 有效優化代碼?
函數優化?
對象優化?
CSS對性能的影響
第廿七章、資源優化
資源的壓縮與合并?
圖片格式優化?
圖片加載優化?
字體優化?
資源文件優化
第廿八章、構建優化
webpack的依賴優化?
基于webpack的持久化緩存?
基于webpack的應用大小監測與分析
第廿九章、傳輸加載優化
啟用壓縮Gzip
啟用Keep Alive?
HTTP資源緩存?
一次性理解Service
workers技術，給網站提速
用流行的SSR技術給前端減負
第卅章、前端可視化
圖形學基礎?
可視化中的數學?
實現3d可視化圖表?
webgl 與 canvas繪制加速
第卅一章、cocos2d 移動端游戲開發
cocos2djs 開發環境搭建?
cocos-creatrot 工具使用?
cocos中的基本概念與使用
精靈
游戲中場景與層?
游戲中用戶事件?
粒子系統?
動畫與特效?
瓦片地圖?
網絡請求?
打包發布到web平臺?
打包發布到ios平臺?
打包發布到安卓平臺
第卅二章、web3js 前端區塊鏈入門
區款連技術簡介?
當前區款連發展分析?
Solidity語法初探?
Web3.js
基本api使用?
搭建基于priter搭建eth私有鏈?
了解Dao并且為DAO設置客戶端應用程序?
創建會員NFT?
創建自發token并實現鏈上治理
第卅三章、Serverless
serveless到底是什么?
搭建私有Serverless（一）：K8s和云原生CNCF?
搭建私有Serverless（二）：基于K8s的Serverless?
Serverless架構應該如何選型？
第卅四章、WebAssembly
我們為什么要了解 WebAssembly?
WebAssembly 模塊的基本組成結構?
WebAssembly
微觀世界的基本數據規則?
WebAssembly
操作系統接口?
將自定義的語言編譯到 WebAssembly?
實現一個 WebAssembly 在線多媒體處理應用?
Wasm
應用的調試與分析
第卅五章、WebRTC
基礎概念與簡單集成?
RTC場景下音頻場景與最賤實踐?
RTC場景下視頻場景與最賤實踐?
RTC工程指標：穩定性、性能調優、秒開優化?
RTC場景下網絡調優經驗?
RTC場景音視頻監控與分析?
WebRTC
自研要點梳理
京公網安備 11010802030320號