一、基础知识

1. 浏览器与网络 浏览器渲染机制：重排（Reflow）与重绘（Repaint）的区别，如何优化渲染性能？ HTTP/HTTPS：强缓存与协商缓存（Cache-Control、ETag），HTTPS的加密流程（TLS握手）。 跨域问题：同源策略、JSONP、CORS、Proxy代理的实现原理。 Web性能优化：关键渲染路径优化、资源预加载（preload/prefetch）、CDN加速。 WebSocket与SSE：实时通信的实现方式及适用场景。

2. JavaScript核心 事件循环：宏任务与微任务（setTimeout vs Promise），浏览器与Node.js的差异。 原型与继承：原型链、Class语法糖原理、如何实现继承（ES5和ES6）。 闭包与作用域：闭包的应用场景（防抖/节流）、内存泄漏问题。 ES6+特性：箭头函数、Promise/Async、Generator、Proxy/Reflect。 TypeScript：类型推导、泛型、装饰器、Utility Types的使用。

3. 前端框架 React：虚拟DOM原理、Hooks的底层实现（如useState依赖链表）、Fiber架构。 Vue：响应式原理（Object.defineProperty vs Proxy）、Diff算法优化。 状态管理：Redux中间件原理、Vuex的模块化设计。 SSR：Next.js/Nuxt.js的服务端渲染流程及性能优化点。

4. CSS与工程化 布局方案：Flex弹性布局、Grid网格布局、BFC/IFC原理。 CSS预处理器：Sass/Less的变量嵌套、模块化方案（CSS Modules）。 构建工具：Webpack的Loader/Plugin机制、Tree Shaking实现原理。 前端安全：XSS攻击防御（转义、CSP）、CSRF Token生成与校验。

二、算法与数据结构

1. 高频题目 链表操作：反转链表、判断环形链表。 树结构：二叉树的层序遍历、最近公共祖先（LCA）。 字符串处理：最长回文子串、字符串转数字（处理边界）。 数组与排序：合并有序数组、Top K问题（快排/堆排）。 设计题：实现Promise.all、手写防抖/节流函数。

2. 前端场景题 DOM操作：实现虚拟列表优化渲染、深拷贝包含DOM节点的对象。 框架原理：用原生JS模拟Vue的响应式系统。 性能优化：设计图片懒加载方案、计算页面FPS并监控卡顿。

三、系统设计与架构

1. 前端工程化 微前端方案：qiankun的沙箱隔离原理、子应用通信机制。 模块化设计：如何设计可复用的UI组件库（按需加载、主题定制）？ 状态管理：如何设计一个支持时间旅行的状态管理工具？

2. 性能与监控 性能优化体系：首屏加载时间从5s降到1s的完整方案（SSR、代码分割、缓存策略）。 异常监控：前端错误采集（全局捕获、SourceMap解析）、数据上报策略。 编译优化：Webpack的持久化缓存配置、Babel按需polyfill。

3. 复杂场景设计 实时协作应用：如何实现多人协同编辑（Operational Transformation/CRDT）？ 高并发场景：设计一个秒杀页面的前端防刷方案（验证码、请求拦截）。

四、项目经验

1. 核心问题 性能优化案例：如何将首屏加载时间优化50%？具体指标（LCP、FCP）如何提升？ 技术难点：复杂表单的动态校验与异步提交、大规模数据可视化的渲染性能问题。 跨端方案：Hybrid App中JS与Native通信机制（JSBridge设计）。

2. 技术深度 框架源码：React Hooks的依赖链表如何实现状态隔离？Vue3的编译优化细节？ 工程化实践：如何设计一个支持多环境的CI/CD流水线（分支策略、自动化测试）？

五、行为面试

团队协作：如何推动技术方案落地（如引入TypeScript）？如何与UI/后端协作？ 学习能力：最近研究的前沿技术（如WebAssembly、Low-Code平台）。 压力应对：线上页面白屏如何紧急排查？如何平衡业务需求与技术债？

六、面试建议 重点复习：浏览器原理、框架底层机制、手写代码能力。 刷题方向：LeetCode高频题（Easy/Medium）、前端手写题（Promise、柯里化）。 项目复盘：梳理项目中技术选型逻辑（如为什么选Vue3而不是React）。