技术复习要点清单

好的，根据您的简历和目标岗位（高级前端架构师-云原生方向）的要求，我为您梳理了一份详尽的技术复习要点清单。这份清单不仅包括需要“知道”的知识，更侧重于需要“深入理解并能清晰阐述”的原理和设计思路。

---

一、 核心技术栈深度复习

1. JavaScript & TypeScript

• JavaScript
  • 事件循环 (Event Loop)： 宏任务、微任务、Node.js与浏览器的事件循环差异。能画图阐述一个复杂异步代码的执行顺序。
  • 内存管理与垃圾回收： V8引擎的垃圾回收机制（标记清除、引用计数）、常见内存泄漏场景（闭包、遗忘的定时器/DOM引用）、如何用Chrome DevTools排查内存泄漏。
  • 原型与继承： 原型链、Class语法糖的本质、继承的多种实现方式及优缺点。
  • ES6+ 核心特性： Promise、Async/Await、Generator、Module、箭头函数、解构赋值等。
• TypeScript
  • 类型系统： 泛型及其约束、高级类型（联合、交叉、映射、条件类型）、类型守卫、类型推断。
  • 工程化价值： 如何配置tsconfig.json、如何为第三方库编写声明文件（.d.ts）、TS在大型项目中如何保障代码质量和开发者体验。

2. Vue.js (核心重点)

• Vue 2 & Vue 3 差异与原理：
  • 响应式原理： Vue 2 的 Object.defineProperty vs Vue 3 的 Proxy。优缺点对比，Vue 3 如何解决数组和对象属性新增的监听问题？
  • Composition API vs Options API： 设计理念、优势（逻辑复用、代码组织、TypeScript支持）。
  • 虚拟DOM与Diff算法： 为什么要用VDOM？Vue的Diff算法大致流程（同层比较、key的作用等）。
  • 生命周期： 熟悉各个生命周期钩子，特别是setup如何整合它们。
• 生态库： Vue Router、Pinia/Vuex 的原理和使用场景。

3. Node.js & MidwayJS

• Node.js 核心：
  • 模块机制： CommonJS vs ES Module，require的查找路径。
  • 事件驱动、非阻塞I/O模型： 理解其高并发原理。
  • Stream（流）： 四种流类型，如何用流处理大文件，背压问题。
  • 进程与集群： Child Process、Cluster模块，如何利用多核CPU？PM2原理。
• MidwayJS框架：
  • 依赖注入（IoC）原理及其优势。
  • 生命周期、中间件、过滤器机制。
  • 如何连接和操作多种数据库（MySQL, ClickHouse）。

4. 构建工具与工程化

• Webpack
  • 核心概念： Loader、Plugin、Bundle、Chunk的区别。
  • 打包优化： Tree Shaking、Code Splitting（如何按页面/组件拆分）、缓存（hash、chunkhash、contenthash）。
  • 性能分析： 如何用webpack-bundle-analyzer分析包体积，制定优化策略。
  • Loader/Plugin开发： 写过自定义Loader/Plugin吗？能阐述其工作原理吗？
• Vite
  • 核心原理： 基于ES Module和Native ESM的按需编译，为什么比Webpack开发环境快？
  • 与Webpack的对比： 各自适用场景？如何在老项目迁移？
• 通用工程化：
  • CI/CD流程设计（与Jenkins/GitLab CI的集成）。
  • 代码规范： ESLint、Prettier、Husky、Commitlint如何集成到流程中。
  • 质量保障： 单元测试（Jest/Vitest）、E2E测试（Cypress/Playwright）方案。

---

二、 架构设计能力复习

1. 微前端

• 各种方案原理与对比： iframe、Single-SPA、qiankun、Module Federation、Webpack 5 Federation。你必须非常熟悉你项目中用的方案。
• 核心挑战与解决方案：
  • 应用隔离： JS沙箱（Proxy、Snapshot）、CSS隔离（Shadow DOM、Scoped CSS）。
  • 数据通信： 自定义事件、状态管理库、URL参数。
  • 公共依赖： 如何共享React/Vue等库避免重复加载？
• 你的项目： 准备好详细阐述你在OMNIEYE平台中的架构设计、技术选型原因、遇到的坑和解决方案。

2. 性能优化

• 指标： FCP, LCP, FID, CLS。如何测量？（Web Vitals, Lighthouse, RUM）
• 网络层面： HTTP2、CDN、缓存策略（强缓存、协商缓存）、压缩（Gzip/Brotli）、图片优化（WebP、雪碧图、懒加载）。
• 渲染层面： 防抖节流、虚拟列表、懒执行、Web Worker处理重任务。
• 框架层面： Vue的异步组件、<KeepAlive>、 computed和watch的合理使用。

3. B端项目架构通识

• 权限系统： RBAC模型、前端路由权限、按钮级权限的设计与实现。
• 状态管理： 复杂中台项目的状态管理方案选型（Pinia/Vuex模块化设计）。
• 组件化设计： 高内聚、低耦合原则。如何设计一套业务组件库？设计和开发流程是什么？

---

三、 软技能与综合能力准备

• 团队管理：
  • 准备具体事例：如何拆分OKR？如何做技术选型和决策？如何进行代码评审？如何培养下属（ mentoring ）？如何处理团队冲突？
  • 思考：从开发者到技术Leader/架构师， mindset上最大的转变是什么？
• 项目与沟通：
  • 准备一个最复杂的项目，能清晰地介绍业务背景、技术挑战、架构图、你的角色、最终成果（量化）。
  • 如何与产品、后端、测试等角色高效协作？有没有推动过其他团队的经历？
• 技术视野：
  • 云原生： 了解Docker、K8s的基本概念（知道Pod、Service、Deployment是什么），理解12-factor应用原则。
  • 大模型/AI： 这是岗位的明确要求。即使项目不深，也要有自己的思考。例如：思考大模型如何用于前端代码生成、UI设计稿转代码、智能客服、数据分析洞察等场景。可以展示你的学习能力和技术热情。
  • 新技术： 了解React 18、Vue 3、Rust、WebAssembly等新技术的发展，并思考它们对你技术领域的影响。

---

复习建议

1. 优先级： 优先深度复习你简历上写了的、且岗位要求明确提到的技术点（Vue, Node, Webpack, 微前端，工程化）。
2. 思维导图： 用思维导图整理知识体系，避免碎片化记忆。
3. 脱口而出： 对核心概念（如Vue响应式、Webpack打包流程、微前端方案对比）要能达到不看资料就能清晰流畅地讲出来的水平。
4. 准备案例： 为每个重要的技术点准备1-2个实战案例（“在XX项目中，我遇到了XX问题，采用了XX技术方案，最终达到了XX效果”）。

这份清单非常全面，希望能帮助您系统性地进行准备。祝您面试顺利，成功拿下Offer！