mksz419 - 前端框架及项目面试聚焦VueReactWebpack

体系课

课程简介

为何要深挖框架底层逻辑许多前端开发者在成长中期容易卡在“只会调用 API，不懂底层机制”的瓶颈。当项目复杂度上升或面临资深工程师面试时，仅仅罗列使用过 Vue 或 React 的组件库已无法体现竞争力。这门课程的核心价值在于拆解主流框架的运行机制，重点解析 Vue 与 React 在工程化环境下的设计差异。它并非面向初学者的语法扫盲，而是针对具备一定开发…

已有 0 人浏览发布 2026-10-17 更新 2026-10-18

为何要深挖框架底层逻辑

许多前端开发者在成长中期容易卡在“只会调用 API，不懂底层机制”的瓶颈。当项目复杂度上升或面临资深工程师面试时，仅仅罗列使用过 Vue 或 React 的组件库已无法体现竞争力。这门课程的核心价值在于拆解主流框架的运行机制，重点解析 Vue 与 React 在工程化环境下的设计差异。它并非面向初学者的语法扫盲，而是针对具备一定开发经验的从业者，解决“架构为何这样设计”、“性能瓶颈究竟在哪里”以及“如何深入回答框架源码高频面试题”这三个关键痛点。对于准备技术晋升或希望从“功能实现者”向“架构思考者”转型的工程师而言，这套内容能帮你补齐从黑盒调用到白盒理解的关键缺口，避免在技术细节上因基础不牢而频繁返工。

学习门槛与建议路径

该课程不适合零基础初学者，它预设你已熟练掌握 JavaScript 核心语法，并至少在一个主流框架中独立交付过完整前端项目。若你刚接触 HTML/CSS 或 JS 逻辑薄弱，直接观看会感到吃力。建议采取对比学习法：先聚焦 Vue 的响应式原理与生命周期，这是理解数据流向的基础；接着深入 React 的组件化思想与状态管理，重点对比两者在处理复杂状态时的优劣；最后攻克 Webpack 的配置调优。学习时不要死记硬背代码片段，而应带着“如果我是框架作者，我会如何设计”的问题去思考。每学完一个原理章节，务必动手复现相关机制，通过实际代码验证逻辑，这样才能将抽象概念转化为肌肉记忆，真正理解框架内部的数据绑定、虚拟 DOM 更新策略及构建工具的打包逻辑。

学完后的独立产出

完成学习后，你能够独立搭建并优化包含路由懒加载、性能监控及代码分割的企业级前端项目，更关键的是具备独立进行技术选型评估的能力。你不仅能清晰向团队阐述选择特定框架的依据，还能提供基于实际场景的性能指标支撑。在面试环节，你能流畅解释框架内部机制，不再受限于背诵标准答案。资料包建议配合源码阅读使用，当看完某部分原理讲解后，立即打开对应框架源码进行断点调试，追踪数据流动过程，这种“理论加源码”的配合方式，是避免学完即忘、确保知识内化的最有效手段，也能让你在面对复杂工程问题时，具备独立的分析与解决能力。

mksz419 - 前端框架及项目面试聚焦VueReactWebpack

课程目录

第10章 webpack 和 babel/
10-1 webpack考点梳理微信-rmshou-收集整理[4][2].mp4
10-10 webpack优化构建速度-知识点串讲微信-rmshou-收集整理[4][2].mp4
10-11 用IngorePlugin忽略无用文件微信-rmshou-收集整理[4][2].mp4
10-12 happyPack是什么微信-rmshou-收集整理[4][2].mp4
10-13 webpack如何配置热更新微信-rmshou-收集整理[4][2].mp4
10-14 何时使用DllPlugin微信-rmshou-收集整理[4][2].mp4
10-15 webpack优化构建速度-考点总结和复习微信-rmshou-收集整理[4][2].mp4
10-16 webpack优化产出代码-考点串讲微信-rmshou-收集整理[4][2].mp4
10-17 什么是Tree-Shaking微信-rmshou-收集整理[4][2].mp4
10-18 ES Module 和 Commonjs 的区别微信-rmshou-收集整理[4][2].mp4
10-19 什么是Scope Hosting微信-rmshou-收集整理[4][2].mp4
10-2 使用 webpack5微信-rmshou-收集整理[4][2].mp4
10-20 babel基本概念串讲微信-rmshou-收集整理[4][2].mp4
10-21 babel-polyfill是什么微信-rmshou-收集整理[4][2].mp4
10-22 babel-polyfill如何按需引入微信-rmshou-收集整理[4][2].mp4
10-23 babel-runtime是什么微信-rmshou-收集整理[4][2].mp4
10-24 webpack考点总结和复习微信-rmshou-收集整理[4][2].mp4
10-25 webpack面试真题-前端代码为何要打包微信-rmshou-收集整理[4][2].mp4
10-26 webpack面试真题-为何Proxy不能被Polyfill微信-rmshou-收集整理[4][2].mp4
10-27 webpack面试真题-常见性能优化方法微信-rmshou-收集整理[4][2].mp4
10-3 webpack基本配置串讲（上）微信-rmshou-收集整理[4][2].mp4
10-4 webpack基本配置串讲（下）微信-rmshou-收集整理[4][2].mp4
10-5 webpack如何配置多入口微信-rmshou-收集整理[4][2].mp4
10-6 webpack如何抽离压缩css文件微信-rmshou-收集整理[4][2].mp4
10-7 webpack如何抽离公共代码和第三方代码微信-rmshou-收集整理[4][2].mp4
10-8 webpack如何实现异步加载JS微信-rmshou-收集整理[4][2].mp4
10-9 module chunk bundle 的区别微信-rmshou-收集整理[4][2].mp4
第11章 项目设计/
11-1 面试为何会考察组件和状态设计微信-rmshou-收集整理[4][2].mp4
11-10 状态设计和组件设计的考点总结微信-rmshou-收集整理[4][2].mp4
11-2 状态设计的思路和要点微信-rmshou-收集整理[4][2].mp4
11-3 组件设计的思路和要点微信-rmshou-收集整理[4][2].mp4
11-4 React实现TodoList代码演示微信-rmshou-收集整理[4][2].mp4
11-5 组件设计和状态设计的总结微信-rmshou-收集整理[4][2].mp4
11-6 Vue实现购物车-你将如何设计微信-rmshou-收集整理[4][2].mp4
11-7 Vue实现购物车data如何设计微信-rmshou-收集整理[4][2].mp4
11-8 Vue实现购物车-组件设计和代码演示微信-rmshou-收集整理[4][2].mp4
11-9 结合vuex实现购物车微信-rmshou-收集整理[4][2].mp4
第12章 项目流程/
12-1 面试为何会考察项目流程微信-rmshou-收集整理[4][2].mp4
12-10 项目沟通的重要性微信-rmshou-收集整理[4][2].mp4
12-11 项目流程总结微信-rmshou-收集整理[4][2].mp4
12-2 和前端开发相关的项目角色有哪些微信-rmshou-收集整理[4][2].mp4
12-3 一个完整的项目要分哪些阶段微信-rmshou-收集整理[4][2].mp4
12-4 评审项目需求时需要注意哪些事项微信-rmshou-收集整理[4][2].mp4
12-5 如何做好技术方案设计微信-rmshou-收集整理[4][2].mp4
12-6 如何保证代码质量微信-rmshou-收集整理[4][2].mp4
12-7 项目过程中PM加需求怎么办微信-rmshou-收集整理[4][2].mp4
12-8 不要对QA说：我电脑没问题！微信-rmshou-收集整理[4][2].mp4
12-9 项目上线微信-rmshou-收集整理[4][2].mp4
第13章 课程总结/
13-1 课程总结微信-rmshou-收集整理[4][2].mp4
第14章 react hooks/
14-1 出几道React-Hooks面试题微信-rmshou-收集整理[4][2].mp4
14-10 什么是自定义Hook（上）微信-rmshou-收集整理[4][2].mp4
14-11 什么是自定义Hook（下）微信-rmshou-收集整理[4][2].mp4
14-12 使用Hooks的两条重要规则微信-rmshou-收集整理[4][2].mp4
14-13 为何Hooks要依赖于调用顺序？微信-rmshou-收集整理[4][2].mp4
14-14 class组件逻辑复用有哪些问题微信-rmshou-收集整理[4][2].mp4
14-15 Hooks组件逻辑复用有哪些好处微信-rmshou-收集整理[4][2].mp4
14-16 Hooks使用中的几个注意事项微信-rmshou-收集整理[4][2].mp4
14-17 Hooks面试题解答微信-rmshou-收集整理[4][2].mp4
14-2 class组件存在哪些问题微信-rmshou-收集整理[4][2].mp4
14-3 用useState实现state和setState功能微信-rmshou-收集整理[4][2].mp4
14-4 用useEffect模拟组件生命周期微信-rmshou-收集整理[4][2].mp4
14-5 用useEffect模拟WillUnMount时的注意事项微信-rmshou-收集整理[4][2].mp4
14-6 useRef和useContext微信-rmshou-收集整理[4][2].mp4
14-7 useReducer能代替redux吗微信-rmshou-收集整理[4][2].mp4
14-8 使用useMemo做性能优化微信-rmshou-收集整理[4][2].mp4
14-9 使用useCallback做性能优化微信-rmshou-收集整理[4][2].mp4
第1章 课程导学/
1-1 框架面试导学微信-rmshou-收集整理(1)[4][2].mp4
1-1 框架面试导学微信-rmshou-收集整理[4][2].mp4
第2章 课程介绍/
2-1 先看几个面试题微信-rmshou-收集整理[4][2].mp4
第3章 Vue 使用/
3-1 先学 vue2 再学 vue3微信-rmshou-收集整理[4][2].mp4
3-10 vue组件更新之后如何获取最新DOM微信-rmshou-收集整理[4][2].mp4
3-11 slot是什么微信-rmshou-收集整理[4][2].mp4
3-12 vue动态组件是什么微信-rmshou-收集整理[4][2].mp4
3-13 vue如何异步加载组件微信-rmshou-收集整理[4][2].mp4
3-14 vue如何缓存组件微信-rmshou-收集整理[4][2].mp4
3-15 vue组件如何抽离公共逻辑微信-rmshou-收集整理[4][2].mp4
3-16 vue高级特性知识点小结微信-rmshou-收集整理[4][2].mp4
3-17 vuex知识点串讲微信-rmshou-收集整理[4][2].mp4
3-18 vue-router知识点串讲微信-rmshou-收集整理[4][2].mp4
3-19 vue使用-考点总结和复习微信-rmshou-收集整理[4][2].mp4
3-2 vue使用-考点串讲微信-rmshou-收集整理[4][2].mp4
3-3 vue基本使用part1微信-rmshou-收集整理[4][2].mp4
3-4 vue基本知识点串讲-part2微信-rmshou-收集整理[4][2].mp4
3-5 vue父子组件如何通讯微信-rmshou-收集整理[4][2].mp4
3-6 如何用自定义事件进行vue组件通讯微信-rmshou-收集整理[4][2].mp4
3-7 vue父子组件生命周期调用顺序微信-rmshou-收集整理[4][2].mp4
3-8 面试会考察哪些vue高级特性微信-rmshou-收集整理[4][2].mp4
3-9 vue如何自己实现v-model微信-rmshou-收集整理[4][2].mp4
第4章 Vue 原理/
4-1 vue原理-大厂必考微信-rmshou-收集整理[4][2].mp4
4-10 深入diff算法源码-patch函数微信-rmshou-收集整理[4][2].mp4
4-11 深入diff算法源码-patchVnode函数微信-rmshou-收集整理[4][2].mp4
4-12 深入diff算法源码-updateChildren函数微信-rmshou-收集整理[4][2].mp4
4-13 虚拟DOM-考点总结和复习微信-rmshou-收集整理[4][2].mp4
4-14 模板编译前置知识点-with语法微信-rmshou-收集整理[4][2].mp4
4-15 vue模板被编译成什么微信-rmshou-收集整理[4][2].mp4
4-16 vue组件可用render代替template微信-rmshou-收集整理[4][2].mp4
4-17 回顾和复习已学的知识点微信-rmshou-收集整理[4][2].mp4
4-18 vue组件是如何渲染和更新的微信-rmshou-收集整理[4][2].mp4
4-19 vue组件是异步渲染的微信-rmshou-收集整理[4][2].mp4
4-2 如何理解MVVM微信-rmshou-收集整理[4][2].mp4
4-20 如何用JS实现hash路由微信-rmshou-收集整理[4][2].mp4
4-21 如何用JS实现H5 history路由微信-rmshou-收集整理[4][2].mp4
4-22 vue原理-考点总结和复习微信-rmshou-收集整理[4][2].mp4
4-3 监听data变化的核心API是什么微信-rmshou-收集整理[4][2].mp4
4-4 如何深度监听data变化微信-rmshou-收集整理[4][2].mp4
4-5 vue如何监听数组变化微信-rmshou-收集整理[4][2].mp4
4-6 虚拟DOM-面试里的网红微信-rmshou-收集整理[4][2].mp4
4-7 用过虚拟DOM吗微信-rmshou-收集整理[4][2].mp4
4-8 虚拟DOM-diff算法概述微信-rmshou-收集整理[4][2].mp4
4-9 深入diff算法源码-生成vnode微信-rmshou-收集整理[4][2].mp4
第5章 Vue 面试真题演练/
5-1 vue真题演练1-v-for为何使用key微信-rmshou-收集整理[4][2].mp4
5-2 vue真题演练2-组件data为何是函数微信-rmshou-收集整理[4][2].mp4
5-3 vue真题演练3-何时使用keep-alive微信-rmshou-收集整理[4][2].mp4
5-4 vue真题演练4-何时需要使用beforeDestroy微信-rmshou-收集整理[4][2].mp4
5-5 vue真题演练5-diff算法时间复杂度微信-rmshou-收集整理[4][2].mp4
5-6 vue真题演练6-vue常见性能优化微信-rmshou-收集整理[4][2].mp4
第6章 Vue3 学习（新）/
6-1 vue3 考点概述微信-rmshou-收集整理[4][2].mp4
6-10 为什么需要toRef和toRefs微信-rmshou-收集整理[4][2].mp4
6-11 vue3升级了哪些重要功能微信-rmshou-收集整理[4][2].mp4
6-12 Composition API 如何实现逻辑复用微信-rmshou-收集整理[4][2].mp4
6-13 Vue3如何实现响应式微信-rmshou-收集整理[4][2].mp4
6-14 Proxy 基本使用微信-rmshou-收集整理[4][2].mp4
6-15 vue3用Proxy 实现响应式微信-rmshou-收集整理[4][2].mp4
6-16 v-model参数的用法微信-rmshou-收集整理[4][2].mp4
6-17 watch和watchEffect的区别微信-rmshou-收集整理[4][2].mp4
6-18 setup中如何获取组件实例微信-rmshou-收集整理[4][2].mp4
6-19 什么是PatchFlag微信-rmshou-收集整理[4][2].mp4
6-2 vue3 对 vue2 有什么优势微信-rmshou-收集整理[4][2].mp4
6-20 什么是HoistStatic和CacheHandler微信-rmshou-收集整理[4][2].mp4
6-21 SSR和Tree-shaking的优化微信-rmshou-收集整理[4][2].mp4
6-22 Vite 为什么启动非常快微信-rmshou-收集整理[4][2].mp4
6-23 ES Module 在浏览器中的应用微信-rmshou-收集整理[4][2].mp4
6-24 Composition API 和 React Hooks 的对比微信-rmshou-收集整理[4][2].mp4
6-25 vue3考点总结微信-rmshou-收集整理[4][2].mp4
6-3 vue3 和 vue2 的生命周期有什么区别微信-rmshou-收集整理[4][2].mp4
6-4 如何理解Composition API和Options API微信-rmshou-收集整理[4][2].mp4
6-5 如何理解ref toRef 和 toRefs微信-rmshou-收集整理[4][2].mp4
6-6 toRef和toRefs如何使用微信-rmshou-收集整理[4][2].mp4
6-7 ref toRef和toRefs的最佳使用方式微信-rmshou-收集整理[4][2].mp4
6-8 为什么需要用 ref微信-rmshou-收集整理[4][2].mp4
6-9 为何ref需要value属性微信-rmshou-收集整理[4][2].mp4
第7章 React 使用/
7-1 React使用-考点串讲微信-rmshou-收集整理[4][2].mp4
7-10 setState是同步还是异步微信-rmshou-收集整理[4][2].mp4
7-11 setState合适会合并state微信-rmshou-收集整理[4][2].mp4
7-12 React组件生命周期微信-rmshou-收集整理[4][2].mp4
7-13 React基本使用-知识点总结和复习微信-rmshou-收集整理[4][2].mp4
7-14 React函数组件和class组件有何区别微信-rmshou-收集整理[4][2].mp4
7-15 什么是React非受控组件微信-rmshou-收集整理[4][2].mp4
7-16 什么场景需要用React Portals微信-rmshou-收集整理[4][2].mp4
7-17 是否用过React Context微信-rmshou-收集整理[4][2].mp4
7-18 React如何异步加载组件微信-rmshou-收集整理[4][2].mp4
7-19 React性能优化-SCU的核心问题在哪里微信-rmshou-收集整理[4][2].mp4
7-2 关于 React17微信-rmshou-收集整理[4][2].mp4
7-20 React性能优化-SCU默认返回什么微信-rmshou-收集整理[4][2].mp4
7-21 React性能优化-SCU一定要配合不可变值微信-rmshou-收集整理[4][2].mp4
7-22 React性能优化-PureComponent和memo微信-rmshou-收集整理[4][2].mp4
7-23 React性能优化-了解immutable.js微信-rmshou-收集整理[4][2].mp4
7-24 什么是React高阶组件微信-rmshou-收集整理[4][2].mp4
7-25 什么是React Render Props微信-rmshou-收集整理[4][2].mp4
7-26 React高级特性考点总结微信-rmshou-收集整理[4][2].mp4
7-27 Redux考点串讲微信-rmshou-收集整理[4][2].mp4
7-28 描述Redux单项数据流微信-rmshou-收集整理[4][2].mp4
7-29 串讲react-redux知识点微信-rmshou-收集整理[4][2].mp4
7-3 JSX基本知识点串讲微信-rmshou-收集整理[4][2].mp4
7-30 Redux action如何处理异步微信-rmshou-收集整理[4][2].mp4
7-31 简述Redux中间件原理微信-rmshou-收集整理[4][2].mp4
7-32 串讲react-router知识点微信-rmshou-收集整理[4][2].mp4
7-33 React使用-考点总结微信-rmshou-收集整理[4][2].mp4
7-4 JSX如何判断条件和渲染列表微信-rmshou-收集整理[4][2].mp4
7-5 React事件为何bind this微信-rmshou-收集整理[4][2].mp4
7-6 React 事件和 DOM 事件的区别微信-rmshou-收集整理[4][2].mp4
7-7 React表单知识点串讲微信-rmshou-收集整理[4][2].mp4
7-8 React父子组件通讯微信-rmshou-收集整理[4][2].mp4
7-9 setState为何使用不可变值微信-rmshou-收集整理[4][2].mp4
第8章 React 原理/
8-1 React原理-考点串讲微信-rmshou-收集整理[4][2].mp4
8-10 React原理-考点总结和复习微信-rmshou-收集整理[4][2].mp4
8-2 再次回顾不可变值微信-rmshou-收集整理[4][2].mp4
8-3 vdom和diff是实现React的核心技术微信-rmshou-收集整理[4][2].mp4
8-4 JSX本质是什么微信-rmshou-收集整理[4][2].mp4
8-5 说一下 React 的合成事件机制微信-rmshou-收集整理[4][2].mp4
8-6 说一下React的batchUpdate机制微信-rmshou-收集整理[4][2].mp4
8-7 简述React事务机制微信-rmshou-收集整理[4][2].mp4
8-8 说一下React组件渲染和更新的过程微信-rmshou-收集整理[4][2].mp4
8-9 React-fiber如何优化性能微信-rmshou-收集整理[4][2].mp4
第9章 React 面试真题演练/
9-1 React真题演练-1-组件之间如何通讯微信-rmshou-收集整理[4][2].mp4
9-2 React真题演练-2-ajax应该放在哪个生命周期微信-rmshou-收集整理[4][2].mp4
9-3 React真题演练-3-组件公共逻辑如何抽离微信-rmshou-收集整理[4][2].mp4
9-4 React真题演练-4-React常见性能优化方式微信-rmshou-收集整理[4][2].mp4
9-5 React真题演练-5-React和Vue的区别微信-rmshou-收集整理[4][2].mp4
课程资料/
代码资料.zip
核对章节.txt

mksz419 - 前端框架及项目面试 聚焦VueReactWebpack

为何要深挖框架底层逻辑

学习门槛与建议路径

学完后的独立产出

课程目录

mksz419 - 前端框架及项目面试聚焦VueReactWebpack