序言
前端领域在过去十年经历了寒武纪大爆发般的演进。从最初的 jQuery 刀耕火种，到如今 React/Vue 鼎立、工程化工具百花齐放（Webpack、Vite、Turbopack），再到 Node.js 赋能全栈、AI 辅助编程的崛起，技术的迭代速度令人叹为观止。
之前很多知识都是在业务开发中“按需索取”、零散积累的。随着业务复杂度的提升以及准备高级前端面试的需要，单纯的“API 熟练工”已经无法满足架构设计和复杂性能优化的要求。因此，有必要褪去浮躁，回归底层，系统性地重塑前端知识体系。
本知识库不仅记录了常用的基础语法，更侧重于底层原理（如 V8 垃圾回收、React Fiber 架构）、工程化闭环、性能优化实战以及经典设计模式的业务应用。
⏳ 前端生态演进时间线
了解一个技术的诞生背景，有助于我们更好地理解它解决的痛点。以下是前端核心生态里程碑（按大致诞生/流行时间整理）：
| 年份 | 运行时 / 语言标准 | 框架 / 库 | 构建工具 / 工程化 |
|---|---|---|---|
| 2009 | Node.js (CommonJS), ES5 | - | - |
| 2010 | - | Backbone.js | npm |
| 2011 | - | - | Browserify |
| 2012 | TypeScript | - | Grunt |
| 2013 | - | React | Gulp |
| 2014 | HTML5 标准确立 | Vue | Webpack, Babel |
| 2015 | ES6 (ES2015) 发布 | Redux, GraphQL | ESLint |
| 2016 | - | Angular (2.0) | - |
| 2018 | Node.js (ESM 实验性支持) | Hooks (React 16.8) | Parcel |
| 2019 | - | - | Rollup (普及), SWC |
| 2020 | WebAssembly 普及 | Vue 3.0 | Vite, esbuild, Snowpack |
| 2022 | Edge Runtime 兴起 | React 18 | Turbopack, Rspack |
| 2024+ | AI 辅助编程 (Copilot/Cursor) | Server Components | 极速构建链（Rust化） |
🌳 核心知识树
本知识库围绕以下几个核心模块展开深度剖析：
- JavaScript 核心原理：词法环境与闭包陷阱、原型链、Event Loop，以及从 ES2015 到 ES2025 的核心特性演进。
- React 深度解析：Fiber 架构下单链表结构、时间切片、优先级调度，Hooks 底层链表机制与 Context 穿透优化。
- Node.js 与底层：V8 引擎内存管理与垃圾回收（Orinoco）、libuv 架构、多进程模型与流（Stream）应用。
- 性能优化闭环：Core Web Vitals 指标体系、长任务（Long Tasks）拆分、首屏与运行时优化 PDCA 闭环。
- 设计模式实战：单例、策略、发布订阅等经典设计模式在真实前端业务场景中的落地。
- Canvas 与图形前端：Canvas 性能优化（离屏渲染、脏矩形）、图形拾取原理与 2D 渲染引擎对比。
- 桌面端开发：Electron 进程模型、IPC 通信与安全性设计。
📚 参考资源
站在巨人的肩膀上，以下是构建本知识库的重要参考资料：