category
前端 GraphQL 客户端集成：Apollo Client（缓存策略/链路中间件/局部状态/乐观更新）、Relay（编译时优化/Fragment colocation/连接分页/refetchContainer）、urql（可扩展的缓存交换层/轻量快速）、缓存架构对比（规范化缓存/文档缓存/网络缓存）、订阅与实时更新（WebSocket/Server-Sent Events）、错误处理与重试策略、TypeScript 类型生成（CodeGen/GraphQL Code Generator）、文件上传与多操作批量、性能优化（数据预取/分页游标/持久化缓存）。
前端性能调试实战：性能指标体系（FCP/LCP/CLS/TTFB/INP）、加载性能优化（代码分割/懒加载/预加载/Tree Shaking/压缩）、运行时性能（内存泄漏/长任务/事件处理）、网络优化（HTTP/2/3/CDN/缓存策略/图片优化）、性能监控（RUM/Real User Monitoring/Core Web Vitals）、Chrome DevTools 高级用法（Performance/Timeline/Memory/Network/Lighthouse）、性能预算与 CI 集成、常见瓶颈诊断流程。
前端表单与验证架构：表单状态管理（受控/非受控/半受控）、验证策略（即时/提交时/混合/防抖）、验证库选型（React Hook Form/Formik/Zod/Yup/Joi）、动态表单与数组字段、文件上传与进度、表单性能优化（减少重渲染/虚拟字段）、无障碍（ARIA label/错误提示/键盘导航/屏幕阅读器）、多步表单与状态机、表单安全（CSRF/XSS/防重复提交）。
深度讲解前端与移动端真实用户监控（RUM）工程实践：Web Vitals 核心指标（LCP/INP/CLS）与计算方式、Performance API 与导航/资源计时采集、长任务与错误采集（Source Map 还原）、会话与采样、隐私合规、移动端 App 监控，以及前后端指标关联定位。
前端动画与渲染性能：浏览器渲染流水线（解析/样式/布局/绘制/合成）、帧率与刷新率（60fps/120fps/VSync）、CSS 动画 vs JS 动画（requestAnimationFrame）、合成层与 GPU 加速（will-change/transform3d）、性能分析工具（Chrome DevTools Performance/Rendering/Layers）、常见性能陷阱（强制同步布局/布局抖动/重绘风暴）、动画优化策略（FLIP/虚拟滚动/离屏渲染）、Web Animations API、SVG 与 Canvas 动画选型。
Bun 与 Deno：现代 JavaScript 运行时选型与实战对比——Bun（Zig 编写、内置 bundler/test/runner/SQLite、Node.js 兼容层）、Deno（Rust 编写、安全沙箱/TypeScript 原生/Web 标准 API/npm 兼容）、运行时性能基准（启动时间/HTTP 吞吐/ESM 加载）、包管理对比（Bun 锁文件/Deno 导入映射）、部署场景（边缘计算/CLI 工具/服务端渲染）、迁移策略与陷阱、与 Node.js 的生态位分析。
React Server Components 实战：RSC 与 SSR/CSR 区别、Server Component 执行环境（Node.js/Edge）、客户端组件边界（'use client'）、流式传输（Suspense + Streaming）、数据获取与缓存（React Cache/fetch 自动 dedupe）、Server Action 与表单突变、混合架构设计（App Router 文件约定）、性能优化（Payload 大小/部分水合/选择性渲染）、与 Next.js App Router 深度集成、常见陷阱与排错。
引言 CSS 的工程化是前端领域最「百花齐放」也最「众说纷纭」的部分：BEM 方法论、CSS Modules、CSS-in-JS、Tailwind 的 utility-first，以及容器查询等原生新特性，各有拥趸也各有取舍。本文梳理 CSS 的演进脉络，逐层对比主流样式方案的适用场景，并给出可落地的选型决策与团队规范建议。
引言 可访问性（a11y）与国际化（i18n）经常被当作项目收尾的「锦上添花」，但它们在工程上其实是同一件事的两种延伸：让产品服务于更广泛的用户。本文从 WCAG 2.2 四大原则出发，讲解 ARIA 的正确用法、键盘导航与焦点管理、屏幕阅读器兼容，以及基于 i18next/react-intl 的国际化工程方案，包括复数规则与 RTL 布局的落地细节。
引言 渲染模式决定了用户看到第一个字节的速度、SEO 的可见性与服务器的成本。CSR、SSR、SSG、ISR 各有适用边界，Next.js App Router 的 React Server Components 与流式渲染又进一步模糊了传统分类。本文系统梳理渲染模式全景，深入 Next.js、Nuxt、Astro 等框架的实现机制，并给出按业务场景的选型建议。
引言 前端测试长期处于两难：写多了成本高、写少了回归多。破局的关键不是追求某个覆盖率数字，而是建立分层策略——用单元测试锁定纯逻辑，用组件测试锁定交互，用 E2E 锁定关键用户旅程。本文以 Vitest、Testing Library、Playwright 和 MSW 为工具链，给出从单测到 E2E 的完整落地方法，以及覆盖率与质量门禁的务实配置。
引言 微前端不是一个新的框架，而是一套把单体前端拆分为多个可独立开发、独立部署、独立运行的子应用的架构模式。它解决的核心痛点是大型团队的协作边界与发布耦合。本文从动机出发，拆解 qiankun（single-spa）的加载与沙箱机制、webpack 5 Module Federation 的运行时共享原理、样式/路由/状态隔离方案，并对两种主流路线的取舍给出工程化建议。
引言 状态管理是前端架构中最容易被低估、也最容易演变成技术债的领域。useState 解决的是组件局部状态，Context 解决的是跨层级传递，但当共享状态开始跨越模块、页面甚至服务端边界时，方案的取舍就变得复杂。本文系统梳理从 React 内置方案到 Redux/Zustand/信号、再到 TanStack Query 的完整图谱，并给出可落地的选型决策树。
构建运行时类型安全边界：Zod 判别联合/transform/refine/效果、Valibot 对比选型、API 输入输出契约建模，以及 schema 与类型体操的深度结合。
用 TypeScript 类型系统重新审视经典设计模式：工厂/策略/观察者/组合模式的类型安全实现，以及函数式风格与 OOP 风格的对照与选型。
深入 TypeScript 异步并发控制：Promise 状态机与微任务语义、AbortController 取消传播、手写 p-limit 并发池、任务队列与 async/await 错误传播模式。
面向大型 TypeScript 项目的工程架构：base/app/worker 三层 tsconfig 策略、monorepo paths 别名、Project References 项目引用、模块解析与架构边界治理。
从 TS 5.0 标准装饰器语法出发，详解类/方法/参数装饰器、reflect-metadata 设计时反射，手写一个轻量依赖注入容器，并与 NestJS 装饰器体系逐项对照。
深入 TypeScript 类型体操：条件类型分发语义、键重映射、模板字面量类型、infer 递归组合，手写 DeepPartial/DeepReadonly/函数重载解析等生产级工具类型。
前端技术栈是用户与产品交互的第一触点，决定着体验质量与业务转化的核心指标。本专题按「基础能力 → 框架深入 → 工程化 → 性能优化 → 前沿探索」路径组织全部内容，涵盖 HTML/CSS/JS 核心基础、Vite 构建工具深度解析（HMR/预构建/Rollup 插件）、TypeScript 高级类型系统与严格模式配置、React/Vue/Svelte 三大框架原理与选型对比、状态管理方案全景（Redux/Zustand/Jotai/信号与 TanStack Query）、微前端架构（qiankun 与 Module Federation）、SSR/SSG 渲染模式（Next.js App Router/流式渲染/岛屿架构）、前端测试体系（Vitest/Playwright/MSW）、CSS 架构与样式方案（Tailwind/设计 token/容器查询）、Core Web Vitals 性能指标体系与优化策略、WebAssembly 浏览器端高性能计算、WebRTC 实时音视频通信、PWA 离线应用与服务 Worker，以及前端安全（CSP/XSS/CSRF）、可访问性 a11y 与国际化 i18n 实践。进一步追加 React Server Components 与 Next.js App Router 流式渲染、Bun/Deno 现代运行时选型、前端动画与 GPU 渲染性能、表单验证架构与无障碍、性能调试方法论与 Core Web Vitals 深度诊断、GraphQL 客户端（Apollo/Relay/urql）集成与缓存优化，为前端工程师提供从入门到专家的系统化知识路径。