我的博客

项目与架构题通常用于判断你的项目经验是不是可复用、可扩展、能落地，而不是只会说技术名词。 应用架构Monorepo知识点讲解Monorepo 适合多应用、多包协作。关键能力是 workspace 管理、依赖约束、任务编排、缓存、版本发布和代码边界。 面试常问问：Monorepo 最大收益是什么？ 答：跨包修改可以一次提交，复用工具链和组件更方便，依赖版本更统一。但要配合构建缓存和清晰边界，否则仓库会变慢变乱。 微前端知识点讲解微前端把大型前端拆成多个可独立开发、构建、部署的子应用。常见方案有 iframe、qiankun、Module Federation、Web Components。 面试常问问：微前端要解决哪些隔离问题？ 答：样式隔离、JS 沙箱、路由隔离、状态通信、依赖冲突、公共资源加载和权限统一。 渲染与跨端SSR、SSG 与 CSR知识点讲解CSR 由浏览器渲染，交互...

AI 方向的前端面试越来越常见。重点不是训练大模型，而是理解 LLM 能力边界，并能把 AI 能力稳定接入产品。 大模型基础Transformer、Token 与 Attention知识点讲解Token 是模型处理文本的基本单位，可能是字、词或词片段。Transformer 通过 Attention 建模上下文关系，让模型判断哪些 token 对当前生成更重要。 面试常问问：上下文窗口是什么？ 答：模型一次能处理的 token 数量上限。超过窗口的内容不能全部被模型直接看到，需要摘要、检索或分段处理。 Embedding知识点讲解Embedding 把文本、图片等内容转成向量，让语义相近的内容在向量空间里距离更近。RAG、推荐、聚类、相似搜索都常用 embedding。 面试常问问：Embedding 和关键词搜索有什么区别？ 答：关键词搜索看字面匹配，Embedding 看语义...

前端面试里的数据库题通常不会深到 DBA 级别，但会考察你做全栈项目时是否理解数据建模、索引、缓存和 ORM。 关系型数据库MySQL 与 PostgreSQL知识点讲解关系型数据库用表、行、列和约束组织数据，适合结构清晰、事务要求高的业务。MySQL 使用广泛，生态成熟；PostgreSQL 类型系统、扩展能力和复杂查询能力强。 面试常问问：关系型数据库适合什么场景？ 答：适合订单、用户、支付、权限等需要强一致性、事务、复杂查询和结构化约束的场景。 事务与 ACID知识点讲解事务保证一组操作要么全部成功，要么全部失败。ACID 分别是原子性、一致性、隔离性、持久性。隔离级别越高，并发问题越少，但性能成本越高。 面试常问问：事务能解决什么问题？ 答：能保证关键业务状态一致，比如下单时扣库存、生成订单、写流水必须作为一个整体处理，不能只成功一半。 索引知识点讲解索引本质是用额外数据...

Node.js 对前端来说是工程化、服务端渲染、BFF 和全栈能力的关键补充。面试重点是运行机制和服务稳定性。 运行机制EventLoop知识点讲解Node 的事件循环由 libuv 驱动，包含 timers、pending callbacks、idle/prepare、poll、check、close callbacks 等阶段。setTimeout 在 timers 阶段，setImmediate 在 check 阶段，Promise 微任务会在当前阶段结束后尽快清空。 面试常问问：setTimeout 和 setImmediate 谁先执行？ 答：不一定。顶层代码里受定时器精度和事件循环进入时机影响；如果在 I/O 回调里，setImmediate 通常先于 setTimeout。 Buffer知识点讲解Buffer 用来处理二进制数据。Node 在网络...

工程化面试考察的是你能不能把项目从“能跑”带到“可维护、可构建、可发布、可协作”。 构建工具Vite知识点讲解Vite 开发环境基于原生 ESM，按需转换模块，所以冷启动快。生产构建默认使用 Rollup，负责打包、代码分割和资源优化。 面试常问问：Vite 为什么比 Webpack 开发启动快？ 答：Webpack 开发时通常要先构建依赖图并打包；Vite 利用浏览器原生 ESM，源码按需编译，依赖预构建后缓存，启动成本更低。 Webpack、Rollup 与 Rspack知识点讲解Webpack 生态成熟，适合复杂业务和历史项目。Rollup 更擅长库打包，输出更干净。Rspack 用 Rust 实现，目标是兼容 Webpack 生态并提升性能。 面试常问问：Loader 和 Plugin 区别？ 答：Loader 处理单个模块的转换，比如 TS、CSS、图片；Plugin ...

Vue3 面试常从 API 用法切到源码原理：响应式如何追踪依赖、组件如何更新、虚拟 DOM 如何 diff、编译器做了什么优化。 响应式系统Proxy、track 与 trigger知识点讲解Vue3 用 Proxy 拦截对象读取和修改。读取时通过 track 收集当前副作用函数，修改时通过 trigger 通知相关副作用重新执行。依赖关系通常可以理解成 target -> key -> effects。 面试常问问：Vue3 为什么用 Proxy 替代 Object.defineProperty？ 答：Proxy 能拦截新增、删除、数组索引、Map/Set 等更多操作，不需要递归劫持所有属性，能力更完整。 ref、reactive 与 computed知识点讲解reactive 用于对象响应式，ref 用于包装任意值，模板里会自动解包。computed ...

TypeScript 面试重点不是会不会写类型标注，而是能否用类型系统表达约束、减少运行时错误，并理解类型推导的边界。 类型系统基础any、unknown 与 never知识点讲解any 会关闭类型检查，适合迁移期兜底但不建议滥用。unknown 表示未知类型，使用前必须做类型收窄，更安全。never 表示永远不会出现的值，常用于穷尽检查和抛错函数。 面试常问问：any 和 unknown 区别？ 答：any 可以赋值给任意类型，也可以任意访问属性，等于放弃检查；unknown 只能赋值给 unknown 或 any，使用前必须判断类型。 类型推断与类型收窄知识点讲解TS 会根据初始化值、函数返回值、控制流判断推导类型。常见收窄方式包括 typeof、instanceof、in、判空、字面量判断、自定义类型守卫。 面试常问问：什么是类型守卫？ 答：类型守卫是在运行时做判断，并让 ...

前端算法面试不一定追求竞赛难度，但会考察你拆问题、分析复杂度、写出稳定代码的能力。 数据结构数组与链表知识点讲解数组支持随机访问，按索引读取是 O(1)，但中间插入删除通常是 O(n)。链表插入删除节点方便，但查找需要遍历。面试中数组常配合双指针、滑动窗口、前缀和；链表常考反转、快慢指针、环检测、合并。 面试常问问：判断链表是否有环怎么做？ 答：用快慢指针。慢指针每次走一步，快指针每次走两步。如果有环，两者一定会相遇；如果快指针走到空，说明无环。 栈与队列知识点讲解栈是后进先出，适合括号匹配、单调栈、函数调用、撤销操作。队列是先进先出，适合 BFS、任务调度。双端队列常用于滑动窗口最大值。 面试常问问：有效括号怎么做？ 答：遇到左括号入栈，遇到右括号就看栈顶是否匹配。最后栈为空才合法。关键是提前处理栈空和类型不匹配。 树与图知识点讲解树题重点是递归定义：一棵树的问题通常可以拆成当...

网络题是前端面试的底层能力题。优秀回答要能从协议特性落到页面加载、接口稳定性和安全。 HTTPHTTP/1.1知识点讲解HTTP/1.1 支持长连接、管线化、缓存控制和 Host 头。它的问题是队头阻塞：同一个连接上的请求响应必须按顺序返回，所以浏览器通常会为同一域名开多个连接。 面试常问问：HTTP/1.1 有什么性能问题？ 答：请求头重复、连接数量有限、队头阻塞明显。优化手段包括连接复用、资源合并、缓存、域名分片，但这些在 HTTP/2 时代不一定仍然适合。 HTTP/2 与 HTTP/3知识点讲解HTTP/2 使用二进制分帧、多路复用、头部压缩和服务端推送。它解决了 HTTP 层队头阻塞，但 TCP 层丢包仍会影响整个连接。HTTP/3 基于 QUIC 和 UDP，减少握手成本，并改善 TCP ...

浏览器原理常用来判断你是否只会写业务，还是理解页面从输入 URL 到展示、交互、优化的完整链路。 浏览器架构多进程模型知识点讲解现代浏览器通常包含浏览器进程、网络进程、GPU 进程、渲染进程、插件进程等。每个标签页一般会有独立渲染进程，隔离页面执行环境，提高稳定性和安全性。 面试常问问：为什么浏览器要多进程？ 答：主要是稳定性、安全性和性能隔离。某个页面崩溃不至于拖垮整个浏览器，不同站点之间也能做更好的安全隔离。 从输入 URL 到页面展示知识点讲解核心流程是：URL 解析、缓存检查、DNS 解析、TCP/TLS 握手、发送 HTTP 请求、接收响应、解析 HTML、构建 DOM 和 CSSOM、合成 Render Tree、Layout、Paint、Composite。 面试常问问：输入 URL 后发生了什么？ 答：先从网络链路讲到资源获取，再从渲染链路讲到页面展示。...