前端知识库

用学习路线、面试路线、场景索引和 PDF 覆盖索引组织前端知识库，保留原文章 URL 并提供明确的下一步。

按 Web 基础、浏览器与网络、框架、工程交付、性能、项目场景和算法推进前端能力。

按基础快问、原理深挖、场景排障、性能与项目表达和手写算法组织前端面试复习。

按请求、渲染、安全、跨窗口、工程交付和项目排障组织场景题，连接已有专题并标记仍需补充的技术主题。

把 12 份编号面试 PDF、5 份场景/项目 PDF、前一轮年度资料、第一篇至第六篇资料和本轮新增 9 份 PDF 映射到知识库文章，标记已融合、部分覆盖和过滤原因。

把前端年度趋势、AI 工程方向和不同职级的面试表达放进同一张可执行的地图。

把三份高频真题预测资料中的协议、模块、框架、性能、算法和表达题按学习顺序串联，并链接到可展开的知识点。

详细整理 CommonJS/ESM、HTTP 版本、跨域安全、缓存、URL 访问链路、Webpack 构建与 Module Federation 的面试回答。

从 Web Vitals、构建与运行时优化，到移动端 1px、虚拟列表、Worker 和大数据传输，整理可验证的面试回答。

整理 Symbol.iterator、箭头函数、柯里化、Map/Set、Vue/React 状态和不同责任范围的项目表达题。

px 固定像素；em/rem 与字体相关；vw/vh/vmin/vmax 与视口相关。

盒子模型是 CSS 最核心的概念之一，它定义了元素如何在页面上占据空间。面试中考察这个问题，主要是想了解候选人对 CSS 布局基础的理解程度，以及是否清楚标准盒子模型和 IE 怪异盒子模型的区别。

BFC (Block Formatting Context) 是 CSS 中一个非常重要但容易被忽视的概念。面试中考察 BFC，主要是想了解候选人是否理解 CSS 的渲染机制，以及能否利用 BFC 解决实际布局问题。

响应式设计是现代 Web 开发的核心能力。面试中考察这个问题，主要是想了解候选人是否具备多端适配的思维，以及是否掌握实现响应式布局的各种技术手段。

元素居中是 CSS 布局中最常见也是最容易出错的问题。面试中考察这个问题，不仅是考察技术掌握度，更是考察候选人对 CSS 布局原理的理解深度。

两栏/三栏布局是 Web 开发中最经典的布局模式。面试中考察这个问题，主要是想了解候选人对 CSS 布局技术的掌握程度，以及能否根据场景选择最合适的方案。

同源策略限制 协议 + 域名 + 端口 任一不同的访问。

DNS 解析 -> TCP/TLS -> HTTP 请求 -> 解析 HTML/CSS -> 构建渲染树 -> 布局与绘制。（知识点：一次导航的完整链路）

A: 回流更重，因为涉及布局计算。（深入阅读：回流与重绘）

从多进程架构、导航和渲染流水线深入到事件调度、缓存、安全、Web Vitals 与性能诊断。

从分层契约、资源语义和数据聚合出发，理解 REST、BFF、Serverless 与 GraphQL 的边界、选型和工程落地。

浏览器发请求，服务端返回状态码、头和响应体。（知识点：HTTP 请求示例）

OSI七层模型是计算机网络通信的理论基础，面试官通过这个问题考察候选人对网络体系结构的理解深度，以及能否将抽象的分层概念与实际网络通信联系起来。

TCP/IP是互联网的基础协议族，面试官通过这个问题考察候选人对互联网核心协议的理解，以及能否区分TCP/IP与OSI模型的关系。

TCP和UDP是传输层最重要的两个协议，面试官通过这个问题考察候选人对网络传输原理的理解，以及能否根据场景选择合适的传输协议。

GET和POST是HTTP协议中最常用的两种请求方法，面试官通过这个问题考察候选人对HTTP协议基础的理解深度，以及能否区分表面差异和本质区别。

从结构化类型、收窄和泛型深入到条件类型、型变、运行时边界与公共类型设计。

小程序运行在宿主容器，不是标准浏览器环境。

小程序并非完整浏览器环境，DOM/BOM 能力受限，需适配平台 API。（深入阅读：小程序运行模型）

本篇整理自 6.小程序面试真题-37页.pdf，补充生命周期、登录会话、导航、支付和双线程通信等场景题。

A: 常见是频繁大对象 setData 与复杂长列表渲染。（深入阅读：setData、长列表与卡顿原因）

模块、组件、服务、依赖注入（DI）。（深入阅读：Angular Standalone 组件与依赖注入）

默认机制基于 Zone.js 触发检查，OnPush 可减少不必要渲染。（深入阅读：变更检测与视图更新）

从词法、语法和语义分析到 AST 转换、Babel、Webpack loader/plugin 的学习入口。

理解词法分析、语法分析、AST 节点、遍历与代码生成，并把它们用于 codemod、Lint、DSL 和低代码。

掌握 Babel parser/traverse/types/generator 链路、visitor 插件、按需引入变换、测试和 source map 调试。

从 Compiler、Compilation、Module、Chunk、Bundle 到 Loader/Plugin、分包、压缩和可验证的自定义扩展。

从页面 DSL 到编辑器、运行时渲染和发布，梳理低代码平台的核心边界与工程取舍。

把 Canvas 高清绘制、移动端下拉刷新、跨上下文通信、国际化切换和 npm 包发布整理成可实现、可验证的场景题。

从用户指标、网络加载、渲染运行时到构建治理的性能优化学习入口。

使用 Web Vitals、PerformanceObserver、Network 和 Performance 面板建立可复现的性能诊断流程。

从导航关键路径、缓存、资源提示、压缩、CDN 到图片字体和脚本加载，系统化优化网络阶段。

理解 DOM/CSSOM、布局绘制合成、主线程任务、Observer、长列表、Web Worker 和内存治理。

从更新边界、稳定引用、状态所有权、列表 key、批量更新到 React Compiler 和 Vue v-memo。

从产物分析、依赖治理、代码分割、Tree Shaking、CSS/图片压缩到预算和 CI 回归，建立可持续的构建性能闭环。

把面试资料中的项目方向整理成可落地的项目案例，按背景、约束、架构、职责、指标和复盘组织。

以流式对话、会话上下文、模型适配、工具权限和可观测性为主线，整理一个可验证的 AI 应用前端项目。

围绕物料、画布、Schema、动态表单、图表渲染、出码和版本发布，整理一个可演进的低代码项目案例。

从业务 Hooks 抽象到多格式构建、文档示例、测试和版本发布，整理一个可复用 React 基建项目。

把代码规范、存量迁移、提交门禁和多包发布做成可渐进接入的工具链，并用可审计指标验证治理效果。

从 SDK 采集到告警、容量、预案和事故复盘，整理一个能把前端异常闭环到发布决策的稳定性项目。

从模型调用到工具编排和声明式 UI 渲染，梳理 AI 前端应用的边界、数据流与安全设计。

高效维护“动态连通性”。（深入阅读：并查集 parent 数组）

路径压缩后，均摊复杂度近似常数。（深入阅读：1. parent 数组）

当 union(u, v) 返回 false，说明这条边造成环。（深入阅读：1. 环检测）

A: 动态连通性、集合合并、环检测。（深入阅读：并查集基础知识速览、并查集模板与复杂度）

找“下一个更大/更小元素”、维护有序候选。（深入阅读：递减单调栈）

维护“还没找到答案”的下标集合。（深入阅读：1. 递减栈）

创建型、结构型、行为型。（深入阅读：三大分类）

设计模式是可复用的“解决方案模板”，不是可直接复制的业务代码。（深入阅读：模式的适用边界）

把“对象创建逻辑”从业务代码中剥离，降低耦合。（深入阅读：核心机制）

确保某类在系统中只有一个实例，并提供全局访问点。（深入阅读：核心机制）

将可替换算法独立封装，避免大量 if-else/switch。（深入阅读：核心机制）

观察者是“直接依赖”；发布订阅是“通过事件中心解耦”。（深入阅读：核心机制）

统一 user.name、user.email，区分全局和仓库级配置。（深入阅读：日常提交）

Git 是分布式版本控制系统，核心是“快照模型”而不是“文件差异模型”。每次提交都记录一组文件快照与父提交关系。

A: 协作分支优先 merge 保留历史；个人分支整理可用 rebase。（深入阅读：合并与变基、merge 与 rebase 选型）

从对象模型、引用和暂存区深入到变基、冲突、恢复、发布协作与可审计工程实践。