前端架构师能力自评表

用于量化评估个人在前端架构师各知识领域的掌握程度，帮助发现短板、制定学习计划。

能力分布概览

43知识领域

0已评估

-平均等级

优先补强：JavaScript、TypeScript、Browser、Network、Security

去客观题测评去在线编程题学习数据中心

领域	L1 了解	L2 理解	L3 应用	L4 分析	L5 评估	L6 创造	证据
JavaScript
TypeScript
Browser
Network
Security
HTML/CSS
Accessibility
Data Structures & Algorithms
Design Patterns
Build Tools
Monorepo
CI/CD
Code Quality
Design System
React
Vue
Cross Platform
AI Engineering
Node.js/BFF
Git Workflow
Developer Experience
Deployment & SRE
Package & Supply Chain
System Architecture
Micro Frontend
Performance
Quality
Data & State
Observability
Security Architecture
Real-time
Internationalization
Visualization & Graphics
Serverless & Edge
Data Engineering
Business
Team
Strategy
Communication
Project Management
Hiring
Tech Branding
Tech Governance

本自评表不仅给出等级定义，还为每个领域的每个等级提供可观察行为证据，让自评有据可依。

---

能力等级通用定义

等级	名称	通用行为证据
L1	了解	听说过核心概念，能在面试中说出定义。
L2	理解	能向他人解释原理，能回答常见的"为什么"。
L3	应用	能在项目中独立使用，解决实际问题。
L4	分析	能对比多个方案，分析优缺点和适用场景。
L5	评估	能主导技术选型，输出 ADR 并推动落地。
L6	创造	能设计新方法论、制定团队标准、引领行业实践。

---

各领域可观察行为证据

Level 01 基础层

F01 JavaScript

等级	行为证据
L1	能说出事件循环、闭包、原型链的基本概念。
L2	能解释 Promise 状态流转、this 绑定规则、V8 垃圾回收原理。
L3	能手写防抖/节流/深拷贝/Promise.all，能在项目中避免闭包内存泄漏。
L4	能分析 JS 性能瓶颈（如强制同步布局、长任务），能用 Performance API 定位问题。
L5	能制定团队 JS 编码规范，推动 TypeScript 严格模式落地。
L6	能设计前端运行时框架或 DSL，或在团队中推广新的 JS 工程范式。

F02 TypeScript

等级	行为证据
L1	知道 TypeScript 是 JavaScript 的超集，能写简单类型。
L2	理解 interface vs type、泛型约束、类型收窄。
L3	能为项目配置 tsconfig.json，能编写复杂类型和业务模型。
L4	能手写 ReturnType/Omit 等工具类型，能用 satisfies、Branded Type 提升类型安全。
L5	能制定团队 TS 规范，设计共享类型库，优化 TS 编译性能。
L6	能设计类型驱动的架构模式，推动类型安全在前端全链路落地。

F03 Browser

等级	行为证据
L1	知道浏览器有渲染引擎、JS 引擎、网络线程。
L2	能解释从 URL 到页面显示的完整流程、重排重绘合成差异。
L3	能使用 Performance/DevTools 分析性能，能实现懒加载/虚拟列表。
L4	能优化 LCP/INP/CLS，能用 Web Vitals 建立监控基线。
L5	能制定浏览器兼容性策略，推动渲染性能治理体系建设。
L6	能主导浏览器内核/渲染新技术在团队的应用和标准化。

F04 Network

等级	行为证据
L1	知道 HTTP 请求包含方法、URL、状态码。
L2	能解释 TCP 三次握手、HTTP/2 多路复用、HTTPS/TLS 握手。
L3	能设计请求超时/重试/去重策略，能配置合理的缓存头。
L4	能分析网络瓶颈，能设计 BFF 聚合和 CDN 策略。
L5	能制定团队网络优化规范，推动 HTTP/3、QUIC、DoH 落地。
L6	能设计大规模前端网络架构，制定跨团队网络协议标准。

F05 Security

等级	行为证据
L1	知道 XSS、CSRF、HTTPS 等基本概念。
L2	能解释 XSS 三种类型、CSRF 防御原理、CSP 作用。
L3	能在项目中正确配置 CSP、Cookie 属性、输入输出过滤。
L4	能设计完整的前端安全方案，能进行安全代码审计。
L5	能建立团队安全开发规范，推动供应链安全、WebAuthn 落地。
L6	能制定组织级安全标准，主导安全架构设计和红队演练。

F06 HTML/CSS

等级	行为证据
L1	能写出基本 HTML 标签和 CSS 选择器。
L2	能解释语义化 HTML、盒模型、Flex/Grid 布局。
L3	能独立实现响应式页面，使用 CSS 变量组织样式。
L4	能设计 CSS 架构（BEM/ITCSS/Atomic CSS），优化性能。
L5	能制定团队样式规范，推动 Design Token 与主题化。
L6	能主导组织级样式体系演进，构建跨项目设计基础设施。

F07 Web 无障碍

等级	行为证据
L1	知道无障碍对用户体验的重要性。
L2	能解释 WCAG、ARIA、键盘导航等基础概念。
L3	能在项目中实现基本的可访问性修复。
L4	能进行无障碍审计并制定改进计划。
L5	能建立团队无障碍规范与测试流程。
L6	能推动组织级无障碍文化，影响产品设计与开发标准。

F08 数据结构与算法

等级	行为证据
L1	能说出常见数据结构的名字和基本用途。
L2	能分析简单算法的时间/空间复杂度。
L3	能使用栈、队列、哈希表等解决前端常见问题。
L4	能手写二叉树遍历、双指针、滑动窗口等算法。
L5	能根据业务场景选择最优数据结构并优化性能瓶颈。
L6	能设计高性能算法方案，指导团队算法能力提升。

F09 设计模式与软件工程基础

等级	行为证据
L1	能列举几种常见设计模式。
L2	能解释 SOLID 原则和常见模式的应用场景。
L3	能在代码中识别并使用观察者、策略、单例等模式。
L4	能运用设计模式重构代码，提升可维护性。
L5	能制定团队设计模式规范和代码审查标准。
L6	能设计面向未来的可扩展架构模式并推广到组织。

Level 02 工程化层

E01 Build Tools

等级	行为证据
L1	知道 Webpack/Vite 是构建工具。
L2	能理解 Loader/Plugin 作用、Tree Shaking、Code Splitting 原理。
L3	能独立配置 Webpack/Vite/Rollup，能写自定义 Loader/Plugin。
L4	能优化构建性能，能制定构建产物分析和优化方案。
L5	能主导构建工具选型和迁移（如 Webpack → Rspack）。
L6	能设计团队级构建平台，推动构建性能治理和标准化。

E02 Monorepo

等级	行为证据
L1	知道 Monorepo 是单仓多包管理。
L2	理解 pnpm workspace、依赖提升、workspace 协议。
L3	能搭建 Monorepo，配置 Turborepo/Nx，管理多包版本。
L4	能设计 Monorepo 目录结构，解决循环依赖和远程缓存问题。
L5	能推动大型组织采用 Monorepo，制定代码所有权和发布策略。
L6	能设计企业级 Monorepo 平台，支持数百个包的高效协作。

E03 CI/CD

等级	行为证据
L1	知道 CI/CD 能自动化测试和部署。
L2	能写简单的 GitHub Actions/GitLab CI 配置。
L3	能设计完整的 CI/CD 流水线，包含 lint/test/build/deploy。
L4	能实现灰度发布、回滚策略、多环境管理。
L5	能制定团队 CI/CD 成熟度模型，推动 DevSecOps 落地。
L6	能设计组织级研发效能平台，持续提升交付速度和质量。

E04 Code Quality

等级	行为证据
L1	知道 ESLint/Prettier 能检查代码格式。
L2	能配置 ESLint/Prettier/Husky，理解单元测试和覆盖率。
L3	能设计测试策略（单元/集成/E2E），能写高质量测试用例。
L4	能引入架构测试、属性测试、Codemod 等高级质量工具。
L5	能建立团队质量门禁和 Code Review 文化，推动质量度量。
L6	能设计组织级质量保障体系，定义质量标准和最佳实践。

E05 Design System

等级	行为证据
L1	知道 Design Token 和组件库能提高一致性。
L2	能理解原子化设计、Design Token 三层结构、Storybook。
L3	能搭建组件库，配置构建、测试、文档站点。
L4	能设计主题化、多品牌适配、无障碍组件。
L5	能推动设计系统在多个产品线的应用，建立组件治理流程。
L6	能设计企业级 Design System 平台，连接设计与代码。

E06 React

等级	行为证据
L1	能写简单 React 组件和 Hooks。
L2	理解 Virtual DOM、Fiber、Hooks 原理。
L3	能优化 React 性能（memo/useMemo/useCallback），能写自定义 Hook。
L4	能理解并发特性、Server Components、React Compiler。
L5	能主导 React 技术栈选型和演进，设计复杂应用架构。
L6	能参与 React 生态建设，或在团队中制定 React 开发标准。

E07 Vue

等级	行为证据
L1	能写简单 Vue 组件。
L2	理解响应式原理、虚拟 DOM、Composition API。
L3	能优化 Vue 应用性能，能设计 Composable。
L4	能理解编译优化、Vapor Mode、Vue Router Data Loaders。
L5	能主导 Vue 技术栈选型和演进，设计大型 Vue 应用架构。
L6	能参与 Vue 生态建设，或在团队中制定 Vue 开发标准。

E08 Cross Platform

等级	行为证据
L1	知道 React Native/Flutter/小程序是跨端方案。
L2	能理解跨端方案分类（WebView/原生渲染/自绘引擎）。
L3	能开发小程序/RN/Flutter 应用，能处理平台差异。
L4	能设计跨端公共层，能评估鸿蒙/KMP 等新兴方案。
L5	能主导跨端技术选型和架构演进，制定多端一致性标准。
L6	能设计企业级跨端平台，支持新端快速接入。

E09 AI Engineering

等级	行为证据
L1	知道 LLM、Prompt、RAG、Agent 等基本概念。
L2	能写有效 Prompt，能调用 LLM API 实现对话功能。
L3	能集成 RAG、Function Calling，能实现流式对话界面。
L4	能设计 MCP 接入、结构化输出、LLM 评估与可观测性方案。
L5	能主导 AI Native 产品架构设计，权衡成本、延迟、安全。
L6	能设计企业级 AI 应用平台，推动 AI 工程化标准落地。

E10 Node.js/BFF

等级	行为证据
L1	知道 Node.js 能写服务端代码。
L2	理解 Express/Koa/NestJS 基本用法，能写简单 BFF。
L3	能设计接口聚合、鉴权、缓存、错误处理。
L4	能使用 NestJS 企业级特性、tRPC/gRPC、消息队列、ORM。
L5	能主导 BFF 架构选型和演进，设计高可用服务端方案。
L6	能设计组织级后端-for-前端平台，支撑多前端产品线。

E11 Git 工作流

等级	行为证据
L1	能使用 Git 基本命令（add、commit、push）。
L2	能理解分支、合并、冲突解决等基本概念。
L3	能在团队中遵循既定分支策略开展工作。
L4	能设计适合团队的 Git 工作流与 Code Review 流程。
L5	能建立变更管理、发布节奏与大仓库治理规范。
L6	能推动组织级研发协作标准，持续提升交付质量与效率。

E12 Developer Experience

等级	行为证据
L1	能说出开发体验的重要性。
L2	能解释脚手架、IDE、文档等对效率的影响。
L3	能配置本地开发环境并参与工具链优化。
L4	能设计开发者工具链、文档体系与内循环优化方案。
L5	能建立 DX 度量体系并持续改进研发效率。
L6	能主导组织级开发者平台与文化，显著提升团队幸福感与产出。

E13 前端部署与运维（SRE）

等级	行为证据
L1	能说明前端部署的基本流程。
L2	能理解缓存策略和 CDN 基本原理。
L3	能配置灰度发布和基础监控。
L4	能设计完整的 CI/CD 和回滚方案。
L5	能建设前端 SRE 体系，保障高可用。
L6	能制定跨团队可靠性目标和灾备策略。

E14 前端包管理与供应链安全

等级	行为证据
L1	能说明 npm install 的基本流程。
L2	能理解 package.json 和 lockfile 的作用。
L3	能进行依赖审计和漏洞修复。
L4	能设计依赖治理流程和私有 registry。
L5	能建立供应链安全体系和 SBOM。
L6	能制定行业级依赖安全标准和开源治理策略。

Level 03 架构层

A01 System Architecture

等级	行为证据
L1	知道 MVC/MVVM/BFF/DDD 等概念。
L2	能理解分层架构、模块化、依赖倒置。
L3	能在项目中应用 DDD/分层架构，写出可维护的代码结构。
L4	能对比微内核/插件化/低代码/SDUI/事件驱动/整洁架构。
L5	能主导系统架构设计，输出 ADR 并推动落地。
L6	能设计企业级前端架构标准，引领架构范式演进。

A02 Micro Frontend

等级	行为证据
L1	知道微前端能把大应用拆成小应用。
L2	理解 qiankun/single-spa/Module Federation 基本原理。
L3	能实现微前端基座和子应用接入，处理样式/JS 隔离。
L4	能设计微前端通信、公共依赖共享、性能优化方案。
L5	能主导微前端技术选型和治理，制定多团队协作规范。
L6	能设计企业级微前端平台，支持百级子应用接入。

A03 Performance

等级	行为证据
L1	知道 LCP/FCP/CLS 等性能指标。
L2	能理解性能指标含义和常见优化手段。
L3	能独立完成一次 Lighthouse 优化并提升 15 分以上。
L4	能建立性能监控体系，设计性能预算和 CI 门禁。
L5	能制定团队性能治理规范，推动性能文化。
L6	能设计组织级性能平台，建立性能考核体系。

A04 Quality

等级	行为证据
L1	知道测试能发现 Bug。
L2	能写单元测试，理解测试金字塔。
L3	能设计全链路质量保障方案（测试/Code Review/灰度）。
L4	能引入契约测试、视觉回归、Mutation Testing。
L5	能建立质量门禁和度量体系，推动团队质量文化。
L6	能设计组织级质量工程平台，定义质量标准和流程。

A05 Data & State

等级	行为证据
L1	知道 Redux/Vuex/Zustand 是状态管理工具。
L2	理解客户端状态和服务端状态的区别。
L3	能合理选择状态管理方案，设计数据流。
L4	能设计缓存策略、乐观更新、离线同步方案。
L5	能主导大型应用数据层架构设计。
L6	能设计企业级数据同步引擎或状态管理标准。

A06 Observability

等级	行为证据
L1	知道埋点、错误监控、性能监控。
L2	能接入 Sentry/web-vitals，理解 Logs/Metrics/Traces。
L3	能设计前端监控方案，配置告警规则。
L4	能建立可观测性体系（错误/性能/业务埋点/全链路追踪）。
L5	能制定 SLO/Error Budget，推动稳定性工程建设。
L6	能设计组织级可观测性平台，支撑大规模系统稳定性。

A07 前端安全架构

等级	行为证据
L1	能列举前端安全威胁类型。
L2	能解释威胁建模、SDL、供应链安全等基本概念。
L3	能在项目中应用安全扫描、依赖审计与基础防御。
L4	能设计前端安全架构并进行风险评估。
L5	能建立安全开发生命周期与合规治理体系。
L6	能主导企业级安全战略，推动零信任与隐私架构落地。

A08 实时与协同架构

等级	行为证据
L1	能说出实时通信的常见方式。
L2	能解释 WebSocket、SSE、长轮询的基本原理。
L3	能在项目中实现简单的实时功能。
L4	能设计长连接治理、消息可靠性与协同编辑方案。
L5	能建立实时系统架构与可观测体系。
L6	能主导大规模实时平台架构，支撑高并发与低延迟业务。

A09 国际化与本地化架构

等级	行为证据
L1	能说出国际化与本地化的区别。
L2	能解释 i18n、RTL、时区等基础概念。
L3	能在项目中实现多语言切换与基础本地化。
L4	能设计国际化架构、内容管理与本地化工作流。
L5	能建立跨地区合规与多语言治理规范。
L6	能主导全球化产品技术体系，支撑多市场快速扩张。

A10 前端可视化与图形架构

等级	行为证据
L1	能区分 SVG、Canvas、WebGL 的适用场景。
L2	能使用 ECharts/D3 等库实现常见图表。
L3	能优化中等数据量下的图表性能。
L4	能设计可视化组件架构和渲染抽象层。
L5	能主导大型可视化项目并解决性能瓶颈。
L6	能设计行业领先的可视化引擎或图表标准。

A11 Serverless / Edge 架构

等级	行为证据
L1	能说明 Serverless 和 Edge 的基本概念。
L2	能使用一种平台编写简单的 Edge 函数。
L3	能在项目中引入边缘 SSR 或网关。
L4	能设计基于 Edge 的全球化架构。
L5	能权衡 Serverless/Edge 与传统架构的优劣。
L6	能制定企业级边缘计算战略和技术标准。

A12 前端数据工程

等级	行为证据
L1	能说明埋点和指标的基本概念。
L2	能设计简单的埋点方案和数据报表。
L3	能独立完成 AB 实验设计和分析。
L4	能建立指标体系并推动数据驱动决策。
L5	能设计数据平台和增长实验体系。
L6	能构建企业级数据战略，推动产品持续增长。

Level 04 领导力层

L01 Business

等级	行为证据
L1	能听懂业务需求，按需求实现功能。
L2	能追问需求背后的 Why，理解业务目标。
L3	能用技术方案解决业务痛点，量化技术价值。
L4	能参与产品决策，用 ROI 模型评估技术投入。
L5	能主导技术与业务战略对齐，推动技术赋能业务。
L6	能制定公司级技术商业战略，影响业务方向。

L02 Team

等级	行为证据
L1	能完成个人任务，配合团队协作。
L2	能指导初级同学，参与 Code Review。
L3	能带领小团队完成项目，制定团队规范。
L4	能进行绩效管理、冲突调解、梯队建设。
L5	能设计团队组织架构，推动工程师成长体系。
L6	能管理多团队/部门，建立企业级技术文化。

L03 Strategy

等级	行为证据
L1	能执行上级制定的技术方案。
L2	能理解技术选型背后的 trade-off。
L3	能参与技术选型，输出技术方案。
L4	能主导技术选型，输出 ADR 和评分卡。
L5	能制定 1-3 年技术演进路线图，获得业务方认可。
L6	能制定公司级技术战略，推动组织级技术变革。

L04 沟通表达与影响力

等级	行为证据
L1	能清楚表达个人技术观点。
L2	能进行有效的技术文档写作与一对一沟通。
L3	能在团队中主持技术讨论并推动共识。
L4	能进行跨部门沟通、向上管理与冲突调解。
L5	能通过公开演讲与写作建立技术影响力。
L6	能成为组织技术布道者，推动文化与战略共识。

L05 项目管理与交付

等级	行为证据
L1	能说明项目管理的基本概念。
L2	能理解敏捷/Scrum、里程碑、风险管理等概念。
L3	能参与项目计划并跟踪个人任务进度。
L4	能主导中小型项目的排期、风险管控与交付。
L5	能管理多项目组合，平衡资源与优先级。
L6	能建立组织级项目治理体系，持续提升交付成功率。

L06 招聘培养与组织发展

等级	行为证据
L1	能说明招聘对团队的重要性。
L2	能参与面试并给出基础评价。
L3	能独立进行技术面试并识别人才画像。
L4	能设计招聘流程、面试评估与培养体系。
L5	能建设团队梯队、晋升通道与绩效管理机制。
L6	能制定组织人才战略，塑造高绩效技术文化与雇主品牌。

L07 技术品牌与社区影响力

等级	行为证据
L1	能意识到技术品牌对个人和团队的重要性。
L2	能撰写技术博客或在团队内部分享。
L3	能在部门或公司层面输出技术分享与案例。
L4	能建立团队技术品牌矩阵并推动对外发声。
L5	能策划技术大会、开源项目与社区运营。
L6	能成为行业意见领袖，引领技术趋势并吸引顶尖人才。

L08 技术治理与标准化

等级	行为证据
L1	能遵守团队已有的技术规范。
L2	能参与技术规范的讨论与改进。
L3	能主导制定一个团队或项目的技术标准。
L4	能建立跨团队的技术治理框架。
L5	能推动全组织的技术标准化和合规落地。
L6	能制定行业级技术标准并引领生态。

---

自评表

Level 01 基础层

编号	领域	L1	L2	L3	L4	L5	L6	当前等级	目标等级
F01	JavaScript	☐	☐	☐	☐	☐	☐
F02	TypeScript	☐	☐	☐	☐	☐	☐
F03	Browser	☐	☐	☐	☐	☐	☐
F04	Network	☐	☐	☐	☐	☐	☐
F05	Security	☐	☐	☐	☐	☐	☐
F06	HTML/CSS	☐	☐	☐	☐	☐	☐
F07	a11y	☐	☐	☐	☐	☐	☐
F08	Data Structures & Algorithms	☐	☐	☐	☐	☐	☐
F09	Design Patterns	☐	☐	☐	☐	☐	☐

Level 02 工程化层

编号	领域	L1	L2	L3	L4	L5	L6	当前等级	目标等级
E01	Build Tools	☐	☐	☐	☐	☐	☐
E02	Monorepo	☐	☐	☐	☐	☐	☐
E03	CI/CD	☐	☐	☐	☐	☐	☐
E04	Code Quality	☐	☐	☐	☐	☐	☐
E05	Design System	☐	☐	☐	☐	☐	☐
E06	React	☐	☐	☐	☐	☐	☐
E07	Vue	☐	☐	☐	☐	☐	☐
E08	Cross Platform	☐	☐	☐	☐	☐	☐
E09	AI Engineering	☐	☐	☐	☐	☐	☐
E10	Node.js/BFF	☐	☐	☐	☐	☐	☐
E11	Git Workflow	☐	☐	☐	☐	☐	☐
E12	DX	☐	☐	☐	☐	☐	☐
E13	Frontend SRE	☐	☐	☐	☐	☐	☐
E14	Package & Supply Chain	☐	☐	☐	☐	☐	☐

Level 03 架构层

编号	领域	L1	L2	L3	L4	L5	L6	当前等级	目标等级
A01	System Architecture	☐	☐	☐	☐	☐	☐
A02	Micro Frontend	☐	☐	☐	☐	☐	☐
A03	Performance	☐	☐	☐	☐	☐	☐
A04	Quality	☐	☐	☐	☐	☐	☐
A05	Data & State	☐	☐	☐	☐	☐	☐
A06	Observability	☐	☐	☐	☐	☐	☐
A07	Security Architecture	☐	☐	☐	☐	☐	☐
A08	Real-time	☐	☐	☐	☐	☐	☐
A09	Internationalization	☐	☐	☐	☐	☐	☐
A10	Visualization & Graphics	☐	☐	☐	☐	☐	☐
A11	Serverless & Edge	☐	☐	☐	☐	☐	☐
A12	Data Engineering	☐	☐	☐	☐	☐	☐

Level 04 领导力层

编号	领域	L1	L2	L3	L4	L5	L6	当前等级	目标等级
L01	Business	☐	☐	☐	☐	☐	☐
L02	Team	☐	☐	☐	☐	☐	☐
L03	Strategy	☐	☐	☐	☐	☐	☐
L04	Communication	☐	☐	☐	☐	☐	☐
L05	Project Management	☐	☐	☐	☐	☐	☐
L06	Hiring	☐	☐	☐	☐	☐	☐
L07	Tech Brand & Community	☐	☐	☐	☐	☐	☐
L08	Tech Governance	☐	☐	☐	☐	☐	☐

---

阶段目标参考

职业阶段	基础层	工程化层	架构层	领导力层
初级前端	L2-L3	L1-L2	L1	-
高级前端	L3-L4	L2-L3	L2	L1
前端专家	L4	L3-L4	L3-L4	L2-L3
前端架构师	L4-L5	L4-L5	L4-L5	L4-L5
技术负责人	L4+	L4+	L5-L6	L5-L6

---

自评后的行动

1. 统计当前等级分布：看看自己在哪些层级最薄弱。
2. 对照行为证据：选择最符合自己当前能力的等级，避免高估或低估。
3. 设定目标等级：根据职业方向，设定 3-6 个月的目标。
4. 制定学习计划：优先补齐影响当前工作的短板。
5. 每季度复评一次：跟踪成长进度。

---

示例

编号	领域	当前等级	目标等级	行动计划
F01	JavaScript	L3	L4	精读 V8 博客，手写 Promise
A03	Performance	L2	L3	完成一次项目性能优化并复盘
L03	Strategy	L1	L2	参与一次技术选型讨论，输出 ADR

---

最后更新：2026-06-24