2027 中国大陆 AI 前端 / 全栈求职完整参考指南
本页保留完整的能力矩阵、长期路线、作品集和面试资料。若想先快速建立全景，请从三级学习路线总入口开始。
对象：5 年以上 Vue/Nuxt 前端开发者
主线：Vue/Nuxt + TypeScript + Node.js，Python/FastAPI 达到 AI 工程协作水平
周期：2026 年 9 月起，每周 10–15 小时，准备 8–9 个月
目标：2027 年上半年竞争 AI 前端、AI 全栈、高级前端（AI 产品方向）
资料基线：2026-09-03
0. 核心结论
到 2027 年，普通页面、CRUD、基础组件和样板代码会进一步被 AI 压低价值。“会调用模型 API”也不再稀缺。高级候选人的价值将集中在五件事：
- 把模糊业务问题建模为可交付的软件系统；
- 打通浏览器、BFF、服务、数据库、模型和线上观测；
- 管理 AI 的不确定性，包括评测、引用、权限、成本、延迟和失败；
- 用 AI 提效，但仍能审查、测试、调试和维护代码；
- 用真实产品和测量数据证明能力，而不是罗列名词。
你的最佳定位不是“转算法”，而是：
懂复杂交互和前端工程、又能独立交付可靠 AI 应用的资深产品工程师。
时间建议：软件工程基本盘 40%，全栈与系统设计 25%，AI 应用工程 25%，作品集与求职表达 10%。
1. 2026 年市场事实与 2027 判断
1.1 已验证的市场信号
- GitHub 2025 数据中，TypeScript 在 2025 年 8 月首次超过 Python 和 JavaScript，成为按月贡献者统计的第一语言；使用 LLM SDK 的公共仓库超过 110 万。GitHub 数据不等同于国内职位份额，但表明“类型化应用工程 + AI”正在合流。GitHub Octoverse 2025
- Stack Overflow 2025 调查中，46% 的开发者不信任 AI 输出准确性，信任者为 33%；52% 没有使用 Agent 或只使用更简单的 AI 工具。现实不是 Agent 已解决一切，而是 AI 已普及、可靠性仍需工程师负责。Stack Overflow Developer Survey 2025
- State of JavaScript 指出，最常用的前三个前端框架都已存在十年以上，Vite 和 Vitest 继续领先工具链。主流前端进入成熟期，频繁换框架并不是核心竞争力。State of JavaScript 2024
- 智联招聘公开的 2026 年上半年数据中，人工智能行业招聘企业数同比增长 24.8%，职位数增长 10.6%；人工智能工程师职位增长 19.3%，AI 产品经理增长 87.7%。机会同时来自研发和产品化。中国经济周刊转引智联招聘报告
- 普华永道中国报告显示，2025 年内地 AI 应用类岗位增加近 9 万、增幅 50.8%，开发类岗位增加约 3.05 万、增幅 15.5%。这正是选择 AI 应用工程与全栈交付路线的依据。普华永道中国 2026 AI 就业晴雨表
- 截至 2026 年 9 月，Node.js 24 为 LTS，Node.js 26 为 Current。学习项目和生产项目应使用 LTS。Node.js Releases
1.2 面向 2027 的高概率推断
- 纯页面实现继续贬值。 需求澄清、架构边界、复杂状态、性能、安全和线上责任更值钱。
- AI 成为高级开发者基本素养。 不一定训练模型，但必须理解模型边界、评测、成本和业务接入。
- TypeScript 价值继续上升。 类型同时服务人、AI 代码生成与自动验证，也是工具参数、事件协议和跨服务契约的基础。
- 前端边界向服务端和 AI Runtime 扩展。 SSE、BFF、任务状态、工具审批和 Trace 会更多进入前端岗位。
- 确定性 Workflow 与 Agent 长期并存。 强流程业务更适合“程序控制 + 局部模型决策 + 人工确认”。
- 聊天框作品失去区分度。 权限、评测、失败恢复、成本数据和架构决策才有说服力。
- 行业经验放大技术价值。 企业服务、制造、汽车、金融、教育和医疗更需要“行业流程 + AI + 软件交付”。
1.3 不应押注的低确定性趋势
- 某一家模型、AI IDE 或 Agent 框架长期垄断；
- 生成式 UI 很快形成唯一标准；
- WebGPU 立刻成为普通前端岗位标配；
- 浏览器本地模型马上替代云模型；
- MCP 当前版本的具体字段长期不变。
学习底层问题、协议、评测与安全，不把职业路线绑定到厂商。
2. 岗位地图与推荐定位
| 岗位 | 主要交付 | 必备能力 | AI 深度 | 匹配度 |
|---|---|---|---|---|
| 传统业务前端 | 页面、组件、联调 | Vue/React、CSS、工程化 | 会用 AI 工具 | 高但同质化 |
| 高级/资深前端 | 复杂应用、架构、性能、质量 | 浏览器、TS、测试、系统设计 | AI UX 加分 | 高 |
| AI 前端 | 对话、流式 UI、工具 UI | 前端基本盘、协议、AI UX | 理解模型运行链 | 首选 |
| AI 全栈 | UI、服务、数据、模型 | Nuxt/Node/DB/AI/部署 | 可交付 RAG/Workflow | 首选 |
| AI 应用工程师 | RAG、Agent、评测、集成 | Python/TS、检索、工作流 | 较深 | 可投，需补 Python |
| 模型/算法工程师 | 训练、微调、推理优化 | 数学、PyTorch、CUDA | 很深 | 非本路线目标 |
推荐简历定位：
资深前端 / AI 全栈工程师｜Vue/Nuxt、TypeScript、Node.js｜RAG、Agent Workflow、AI UX
不要把“Prompt Engineer”作为核心头衔。Prompt 是实现细节，不能独立证明生产交付能力。
3. 掌握标准与能力矩阵
3.1 分级
- P0 必须掌握：直接影响目标岗位面试和交付。
- P1 需要理解：能解释、做常用实现、知道边界。
- P2 面试加分：高级岗位或特定公司的差异项。
- P3 暂不投入：了解名称，目标 JD 明确要求再学。
只有同时做到“能解释、能实现、能测试、能说取舍、能观察运行状态”，才算掌握。
3.2 前端基本盘
| 能力 | 等级 | 掌握深度 | 证据 |
|---|---|---|---|
| 闭包、原型、this、模块 | P0 | 解释运行行为与陷阱 | 可运行实验 |
| Event Loop、微任务、异步错误 | P0 | 比较浏览器与 Node | 时序 Bug 复盘 |
| Promise、Async Iterator、Stream | P0 | 流式消费、背压、取消 | SSE 客户端 |
| AbortController | P0 | UI 到模型调用的取消传播 | “停止生成”链路 |
| TypeScript strict | P0 | 不用 any 遮蔽边界 | 类型检查通过 |
| 联合类型与穷尽检查 | P0 | 用状态机表达任务 | RunState 类型 |
| 泛型、条件/映射类型 | P1 | 服务公共库与契约，不炫技 | 类型安全 Client |
unknown + Schema 校验 | P0 | TS 不验证运行时输入 | Zod/Valibot 边界层 |
| ESM、包导出、构建产物 | P1 | 排查 CJS/ESM 问题 | 故障记录 |
| 从 URL 到页面 | P0 | DNS/TCP/TLS/HTTP/解析/渲染 | 链路图 |
| 渲染流水线和性能 | P0 | Layout/Paint/Composite、长任务 | 性能剖析报告 |
| HTTP 缓存和 CDN | P0 | 强缓存、协商缓存、失效 | 缓存方案 |
| CORS、CSP、XSS、CSRF | P0 | 按攻击面设计防护 | 攻击测试 |
| Web Worker / Service Worker | P1 | CPU 转移或离线场景 | Worker 实验 |
| WASM / WebGPU | P3 | 理解场景与限制 | 不要求实现 |
3.3 Vue / Nuxt 主栈
| 能力 | 等级 | 掌握深度 | 证据 |
|---|---|---|---|
| Vue 响应式机制 | P0 | track/trigger、ref/reactive、computed/watch | 依赖图与 Bug 示例 |
| Composition API | P0 | 可测试 Composable、注入、生命周期 | 领域 Composable |
| 状态边界 | P0 | 本地、服务端、全局状态分离 | 选型 ADR |
| Pinia | P1 | 只保存真正跨页面客户端状态 | 最小 Store |
| SSR/CSR/SSG | P0 | 按内容、个性化和成本选择 | 路由策略表 |
| Hydration | P0 | 时间、随机数、浏览器 API、跨请求状态 | 故障案例 |
| Nuxt 数据获取 | P0 | 执行位置、缓存键、刷新 | 无重复请求链路 |
| Server Routes / Nitro | P0 | BFF、密钥、流式响应、Route Rules | Nuxt AI BFF |
| Nuxt 模块与插件 | P1 | 明确模块、插件、自动导入边界 | 小型插件 |
| Vue 编译优化 | P2 | Patch Flag、静态提升、异步组件 | 性能说明 |
| 部署适配 | P1 | Node、容器、Serverless/Edge 差异 | 部署 ADR |
Vue 官方建议新项目使用 Vite，Vue CLI 已处于维护模式；SSR 必须理解 Hydration 和跨请求状态污染。Vue Tooling · Vue SSR · Nuxt Server
3.4 工程质量
| 能力 | 等级 | 掌握深度 | 证据 |
|---|---|---|---|
| Vite | P0 | 预构建、生产构建、环境变量边界 | Bundle 报告 |
| pnpm Workspace | P0 | 共享契约、依赖边界、脚本编排 | Monorepo |
| Vitest / Vue Test Utils | P0 | 纯函数、Composable、组件行为测试 | 单测 |
| Playwright | P0 | E2E、网络模拟、可访问性检查 | 核心 E2E |
| Contract Test | P1 | 防止 Web/API/Python 契约漂移 | Schema 测试 |
| CI/CD | P0 | 类型、Lint、测试、构建、迁移检查 | CI 流水线 |
| Docker Compose | P0 | 可复现依赖和健康检查 | 一键启动 |
| OpenTelemetry | P1 | Trace、Span、上下文传播 | 端到端 Trace |
| Feature Flag | P1 | 灰度模型和 Prompt 版本 | 模型切换开关 |
| 微前端 | P2 | 能判断组织边界，不默认采用 | 采用/拒绝 ADR |
3.5 全栈能力
| 能力 | 等级 | 掌握深度 | 证据 |
|---|---|---|---|
| Node Event Loop 与线程池 | P0 | 区分 I/O 与 CPU 密集任务 | 延迟实验 |
| HTTP Stream 与背压 | P0 | 不只会框架装饰器 | SSE 服务 |
| NestJS | P0 | Module/Guard/Pipe/Interceptor | 分层 API |
| REST | P0 | 资源、错误、分页、版本、幂等 | OpenAPI |
| SSE / WebSocket | P0 | 单向模型流优先 SSE，双向实时才 WS | 选型 ADR |
| OIDC/OAuth 2.0、会话 | P0 | 登录、刷新、撤销、服务端会话 | 身份流程图 |
| RBAC/ABAC | P0 | 权限进入检索和工具调用 | 越权测试 |
| 队列 | P0 | 重试、退避、死信、幂等、进度 | 摄取 Worker |
| PostgreSQL | P0 | 建模、约束、索引、事务、查询计划 | ER 图与慢查询记录 |
| Redis | P0 | 缓存、限流、短期状态 | 穿透/击穿方案 |
| pgvector | P0 | 精确/近似、HNSW、过滤/召回取舍 | 检索基准 |
| 专用向量库 | P2 | 有规模或能力证据才引入 | 选型对比 |
| Kubernetes | P2 | 会读基础资源即可 | 非必做 |
pgvector 支持精确检索和 HNSW、IVFFlat 近似索引；近似索引以召回换速度，多租户过滤也会影响召回，不能“装上向量库就默认正确”。pgvector
4. AI 必知必会
4.1 模型基础
| 概念 | 等级 | 至少会什么 | 误区 |
|---|---|---|---|
| Transformer / Attention | P1 | 模型根据上下文预测 Token 的直观模型 | 把模型当数据库 |
| Token | P0 | 估算上下文、成本、截断 | 字数等于 Token |
| Context Window | P0 | 裁剪、摘要、检索和记忆 | 越长一定越好 |
| Temperature / Top-p | P1 | 采样与可重复性 | 温度 0 绝对确定 |
| 消息角色 | P0 | 指令层级与不可信输入 | System Prompt 是安全边界 |
| Structured Output | P0 | Schema、验证、重试、兼容 | JSON 就可信 |
| Embedding | P0 | 语义向量、距离、版本、维度 | 替代全部关键词搜索 |
| 多模态 | P1 | PDF/图像/音频解析与成本 | 一个模型适合所有模态 |
| Fine-tuning | P2 | 适合风格/重复模式，不补实时知识 | RAG 效果差就微调 |
| 量化/GPU/CUDA | P3 | 能与模型团队交流 | AI 应用岗必须深学 CUDA |
决策口诀：私有/最新知识用 RAG 或工具；固定结构用 Structured Output；固定步骤用 Workflow；有限动作选择用 Tool Calling；大量稳定风格模式才评估 Fine-tuning。
4.2 RAG
摄取：校验 → 解析 → 清洗 → 分块 → 元数据 → Embedding → 索引
查询：权限过滤 → 查询改写 → 混合检索 → 重排 → 上下文组装
生成：带证据回答 → 引用映射 → 流式输出 → 反馈记录
评测：召回 → 重排 → 忠实度 → 引用 → 延迟/成本必须理解：
- 分块应考虑标题、表格、代码和语义边界，不只是固定字符数；
- BM25/全文检索与向量检索互补，专有名词、编号常需要关键词；
- 权限过滤在检索阶段生效，不能检索后只在 UI 隐藏；
- Reranker 是否值得使用要由离线评测证明；
- 引用必须回到原文位置，模型自称“有依据”不算溯源；
- 文档更新需要版本、失效、重建和 Embedding 迁移策略。
4.3 普通调用、Tool、Workflow、Agent、MCP
| 模式 | 控制者 | 适用 | 不适用 |
|---|---|---|---|
| 普通函数 | 代码 | 步骤完全确定 | 不需模型决策 |
| Tool Calling | 模型选择、代码执行 | 意图变化，工具有限 | 高风险动作无审批 |
| Workflow | 程序定义状态图 | 审批、重试、长任务、审计 | 简单问答 |
| Agent | 模型动态决定下一步 | 探索性、步骤难预定义 | 强合规、强确定性流程 |
| MCP | 标准化工具/资源连接 | 多客户端复用能力 | 单项目内部简单函数 |
工具循环必须是：模型提出调用意图 → 服务端验证 Schema、身份、权限、预算、幂等键 → 执行工具 → 保存审计 → 返回结果 → 模型继续或结束。
规则：模型不直接拥有数据库/Shell/付款权限；工具描述不是权限系统；写操作默认预览和人工确认；每轮限制步数、时间和费用；重试带幂等键；长任务状态持久化。
MCP 是开放协议，但 2026 年 7 月修订仍调整了会话、握手、任务和传输行为。学习能力发现、Schema、授权、传输和安全模型，不死背某版字段。MCP Changelog
4.4 AI 前端是你的差异化主场
聊天 UI 是状态机，不是消息数组：
type RunState =
| { status: 'idle' }
| { status: 'submitting'; clientMessageId: string }
| { status: 'streaming'; runId: string; blocks: ContentBlock[] }
| { status: 'awaiting_approval'; runId: string; action: ProposedAction }
| { status: 'completed'; runId: string }
| { status: 'failed'; runId?: string; error: AppError; retryable: boolean }
| { status: 'cancelled'; runId: string }必须处理多类型事件、取消、断线恢复、事件去重、服务端消息顺序、Markdown/XSS、长消息性能、工具审批、部分结构化结果、TTFT/P95 延迟及无障碍提示。
AI SDK 6 提供厂商无关 Core API，并支持 Vue/Nuxt 流式 UI。可以使用，但要先理解 HTTP Streaming 和事件协议。AI SDK 6 · Nuxt Quickstart
4.5 评测、可观测性与安全
| 层次 | 测试内容 | 指标示例 |
|---|---|---|
| 单元测试 | 分块、权限、工具参数、状态转换 | 通过/失败 |
| 检索评测 | 正确证据是否进入候选集 | Recall@k、MRR、nDCG |
| 生成评测 | 回答相关且忠于证据 | 忠实度、拒答正确率 |
| 引用评测 | 引用是否真正支持结论 | Citation Precision/Recall |
| 安全评测 | 注入、越权、泄密、危险工具 | 攻击成功率 |
| 产品指标 | 用户是否完成任务 | 采纳率、人工接管率 |
| 运行指标 | 稳定性和经济性 | TTFT、P95、错误率、单次成本 |
模型、Prompt、Embedding、分块或检索参数变化，都运行固定评测集。LLM-as-a-Judge 可以用，但必须由人工标注样本校准。
安全覆盖直接/间接 Prompt Injection、敏感数据泄露、不安全输出处理、过度权限、向量污染、无限循环和费用型拒绝服务。外部文档和模型输出都视为不可信输入。OWASP GenAI LLM Top 10 · NIST AI RMF
5. 推荐技术栈与选型边界
| 层 | 默认选择 | 原因 | 何时换 |
|---|---|---|---|
| Web | Vue 3 + Nuxt 4 + TypeScript | 保留优势，覆盖 SSR/BFF | 目标岗位明确 React |
| 状态 | Composition API；Pinia 按需 | 避免全局化 | 服务端状态另建查询层 |
| 样式 | CSS Variables + 成熟组件库 | Token 与可访问性优先 | 不把 Tailwind 当核心能力 |
| 包管理 | pnpm Workspace | 严格、适合 Monorepo | 公司统一工具 |
| 测试 | Vitest + Vue Test Utils + Playwright | 覆盖单元、组件、E2E | 存量工具不强迁 |
| BFF | Nuxt Server/Nitro | 密钥、会话、聚合、流式代理 | 领域复杂时拆服务 |
| 核心 API | NestJS | 企业 Node 服务结构清晰 | 小服务可 Fastify/Hono |
| AI 层 | 自有 Adapter + AI SDK Core/UI | 解耦供应商、支持 Vue 流式 | 特殊能力直用厂商 SDK |
| Python | FastAPI + Pydantic | 对接 AI/数据生态 | 不重复普通 CRUD |
| 数据库 | PostgreSQL + pgvector | 事务、全文、向量同库起步 | 有证据再上专用向量库 |
| 缓存/队列 | Redis + BullMQ | 缓存、限流、任务重试 | 企业平台另有标准 |
| 文件 | S3 兼容接口，本地 MinIO | 云厂商可替换 | 遵循公司标准 |
| 观测 | OpenTelemetry + 结构化日志 | 跨服务 Trace | 接入公司 APM |
| 本地环境 | Docker Compose | 一键复现 | 生产再评估 K8s |
业务层不要散落厂商 SDK 类型。最小模型端口：
interface ModelGateway {
stream(req: ModelRequest, ctx: RequestContext): AsyncIterable<ModelEvent>
generateObject<T>(req: StructuredRequest<T>): Promise<StructuredResult<T>>
embed(input: string[]): Promise<EmbeddingResult>
}
type ModelEvent =
| { type: 'text-delta'; delta: string }
| { type: 'tool-call'; callId: string; name: string; args: unknown }
| { type: 'tool-result'; callId: string; result: unknown }
| { type: 'citation'; sourceId: string; quote?: string }
| { type: 'usage'; inputTokens: number; outputTokens: number }
| { type: 'error'; code: string; retryable: boolean }
| { type: 'finish'; reason: string }通用能力走 Gateway；厂商特殊缓存、多模态或推理参数通过受控扩展暴露，不追求虚假的完全统一。
React / Next.js 学到哪里
- 读懂 Hooks、Context、受控组件、Suspense 和常见状态方案；
- 理解 Server/Client Component 和服务端数据获取边界；
- 能在 1–2 天内修改存量 Next.js 页面与接口；
- 能将 Vue Composable、Nuxt Server Route、Hydration 映射到 React/Next；
- 做一次小型迁移练习，不做第三个完整作品。
6. 36 周学习路线
固定周节奏：3 小时原理与源码，6–8 小时项目，2 小时测试/文档，1–2 小时面试表达与复盘。每周必须产出代码、图、测试或复盘之一。
| 周 | 主题 | 产出与验收 |
|---|---|---|
| 1 | 能力盘点与环境 | 建技能雷达；Node 24 LTS、pnpm、Docker 可用 |
| 2 | JS 运行时 | Event Loop/微任务实验，解释输出顺序 |
| 3 | Stream 与取消 | 实现 SSE Demo，取消能传到服务端 |
| 4 | TypeScript 建模 | 用联合类型重构异步状态，禁止 any |
| 5 | 浏览器与网络 | 画 URL 到像素链路，解释缓存/CORS/CSP |
| 6 | 性能 | 用 Performance/Lighthouse 找并修一个瓶颈 |
| 7 | Vue 响应式 | 写依赖追踪示例，解释 computed/watch 取舍 |
| 8 | Nuxt 渲染 | 完成 SSR/CSR/SSG/Hybrid 选型和 Hydration 故障复盘 |
| 9 | Nuxt BFF | 会话、运行时配置、密钥保护、错误模型 |
| 10 | 测试体系 | 单元、组件、E2E 各一条，接入 CI |
| 11 | Node Runtime | 阻塞事件循环实验，理解线程池和背压 |
| 12 | NestJS | 完成模块、Guard、Pipe、Interceptor 分层 |
| 13 | API 契约 | OpenAPI/Schema、统一错误、分页、幂等 |
| 14 | PostgreSQL | 建模、事务、索引、EXPLAIN ANALYZE |
| 15 | Redis 与缓存 | 实现限流、缓存及穿透/击穿保护 |
| 16 | 队列和对象存储 | 文档任务、重试、死信、进度和上传 |
| 17 | Docker 与部署 | Compose 一键启动，服务有健康检查 |
| 18 | 可观测性 | 浏览器到 API/DB 的 Trace 和结构化日志 |
| 19 | LLM 基础 | Token/上下文/采样/结构化输出实验 |
| 20 | 模型适配层 | 两家模型配置切换，业务层不变 |
| 21 | AI 流式协议 | 多事件 SSE、取消、错误和 Usage |
| 22 | Embedding/检索 | 建小语料基准，比较关键词和向量搜索 |
| 23 | RAG 摄取 | 解析、分块、元数据、索引、版本 |
| 24 | RAG 查询 | 权限、混合检索、重排、引用 |
| 25 | 离线评测 | 建不少于 30 条人工核验用例和基线 |
| 26 | Tool Calling | Schema、权限、超时、幂等和审计 |
| 27 | Workflow/Agent | 状态持久化、重试、步数和费用上限 |
| 28 | MCP | 写一个只读 MCP Server 与 Client，记录版本边界 |
| 29 | AI 安全 | 注入、越权、泄密、无限循环攻击测试 |
| 30 | 作品一打磨 | 知识助手功能闭环、部署、评测报告 |
| 31 | 作品一表达 | 架构图、ADR、README、3/10/20 分钟讲法 |
| 32 | 作品二核心 | 工单工作流、工具审批、持久化状态 |
| 33 | 作品二可靠性 | 重试、恢复、审计、Trace、安全测试 |
| 34 | React/Next 补盲 | 将一个 Vue AI 页面迁移到 Next.js |
| 35 | 简历与模拟面试 | 完成四类模拟面试并按录音修正表达 |
| 36 | 定向投递 | 建岗位表、差距表、每周反馈循环 |
如果进度落后，优先删掉 MCP 深入、K8s、WebGPU 和第二套框架练习，不删测试、评测、安全与项目文档。
7. 作品一：企业知识助手
7.1 要证明什么
证明你会做多租户权限、文档摄取、混合检索、引用、流式交互、离线评测和线上观测，而不是只包装模型。
7.2 架构
7.3 推荐目录
apps/web Nuxt UI 与 BFF
apps/api NestJS 领域 API
apps/worker 摄取任务
services/parser-py FastAPI/Pydantic 文档解析
packages/contracts Schema、事件、错误契约
packages/ai-core ModelGateway、RAG、工具定义
packages/evals 数据集、Runner、报告
infra Compose、迁移、观测配置
docs 架构图、ADR、运行手册、复盘7.4 核心接口
| 接口 | 用途 | 关键约束 |
|---|---|---|
POST /v1/documents | 上传并创建摄取任务 | 文件校验、租户、幂等键 |
GET /v1/documents/:id | 查看状态 | queued/processing/ready/failed |
POST /v1/conversations | 创建会话 | 绑定租户和知识空间 |
POST /v1/conversations/:id/messages | 发起流式问答 | SSE、多事件、取消、Usage |
GET /v1/sources/:id | 查看引用原文 | 再次执行权限校验 |
POST /internal/evals/runs | 跑固定评测集 | 记录配置、模型和 Git SHA |
核心数据表：tenants、users、memberships、documents、document_versions、chunks、conversations、messages、runs、citations、feedback、eval_cases、eval_runs。
7.5 RAG 主链路
上传 → MIME/大小/病毒校验 → 对象存储 → 队列 → 解析 → 结构化分块 → Embedding → 原子切换文档版本。查询时先确定租户/用户权限，再做查询改写、全文 + 向量检索、融合、重排、上下文预算、生成和引用映射。
7.6 测试与验收
- 单元：分块、融合排名、权限谓词、事件 Reducer；
- 集成：PostgreSQL/pgvector 查询、队列重试、对象存储；
- 契约：TS 与 Python 对相同 Schema 生成兼容数据；
- E2E：上传到可检索、问答带引用、取消生成、越权失败；
- 评测：至少 30 条人工核验用例，覆盖可回答、不可回答、跨租户和恶意文档；
- 安全：间接 Prompt Injection 不得触发工具或泄露其他租户信息；
- 运行：展示 TTFT、P95、Token/费用、检索耗时和错误 Trace。
数字必须来自实际测量。README 不得编造“准确率 95%”或“性能提升 10 倍”。
7.7 部署与文档
开发使用 Compose；线上部署到任一可公开访问的容器平台，数据库和密钥不随镜像发布。仓库必须包含 .env.example、迁移说明、健康检查、备份说明、架构图、两篇 ADR、评测报告和一次故障复盘。
8. 作品二：售后工单 AI 工作流
8.1 业务场景
系统读取用户问题、订单和政策，分类并检索依据，生成回复与建议动作。模型可以提出 create_ticket、lookup_order、draft_reply、request_refund 等工具调用；所有写操作必须人工确认，支付/退款仅使用 Mock 或沙箱。
8.2 状态机
8.3 必做能力
- Workflow 状态持久化，进程重启后可恢复；
- 工具 Schema、权限、超时、重试、幂等和审计；
- UI 展示计划、证据、工具参数、风险、批准/拒绝；
- 每次状态变化产生不可变事件并带 Trace ID；
- 最多步骤、最长时间、最大 Token/费用预算；
- 失败可重试，副作用不得重复；
- 高风险操作不能依赖 Prompt 承诺实现安全。
只有当普通状态机明显难以维护时才引入 LangGraph 一类框架。它的价值应落在 Durable Execution、Streaming 和 Human-in-the-loop，而不是为了简历名词。LangGraph Overview
8.4 验收
- 读取订单与政策后能生成带依据草稿；
- 未经确认无法执行写工具；
- 重放同一幂等键不会重复建单；
- 模型请求不存在的工具时安全失败；
- 服务重启后待审批任务仍存在；
- Trace 能还原每轮模型、工具、状态和耗时；
- E2E 覆盖批准、拒绝、超时、重试、取消和越权。
9. 面试必须能讲清的调用链
用户输入
→ Nuxt 页面创建 clientMessageId 和 AbortSignal
→ Nuxt BFF 校验会话并隐藏模型密钥
→ NestJS Guard 做身份/租户权限
→ Service 保存消息和 Run
→ 检索层按权限执行混合检索与重排
→ ModelGateway 发起流式模型调用
→ API 将统一 ModelEvent 通过 SSE 返回
→ 前端 Reducer 更新多块内容和工具状态
→ 取消/错误传播到模型、DB 状态和 UI
→ Usage/延迟/Trace/反馈进入观测与评测对每一步准备：输入输出、状态归属、失败方式、重试策略、安全边界和监控指标。
10. AI 辅助开发工作流
AI 编码能力本身也会被考察。建议固定流程：
- 先写问题、边界和验收标准；
- 让 AI 提方案和风险，不直接提交大段生成代码；
- 人决定接口、状态、数据和安全边界；
- 小批量生成；
- 运行类型检查、测试、静态分析和安全扫描；
- 人审查权限、并发、错误和资源释放；
- 用真实输入和恶意输入验证；
- 提交中记录为什么这样改。
面试时不要说“我用 AI 一天写完”。要说 AI 在哪些阶段节省时间、你如何约束上下文、如何验证，以及它曾产生什么错误。
11. 高频面试清单
高级前端
- Event Loop、微任务、渲染时机如何交互？
- Hydration mismatch 为什么发生，如何定位？
- 为什么服务端共享单例状态可能跨用户污染？
- SSE 与 WebSocket 如何选，断线如何恢复？
- TypeScript 类型安全在哪里结束？为什么仍需 Schema？
- 如何定位长任务、内存泄漏和重复渲染？
- 缓存如何失效？CDN、浏览器、BFF 缓存如何协作？
- 如何设计大型前端模块边界和依赖方向？
- 组件测试与 E2E 各自覆盖什么？
- XSS、CSRF、CSP、CORS 分别解决什么问题？
全栈与系统设计
- BFF 与独立 API 的边界是什么？
- 如何实现幂等、重试、死信和最终一致性？
- PostgreSQL 索引为何可能未被使用？
- Redis 缓存击穿、穿透、雪崩如何处理？
- 多租户权限放在哪些层？
- 如何传播 Trace ID 和取消信号？
- 长任务为何不能占住普通 HTTP 请求？
- 如何进行零停机迁移与向后兼容？
AI 应用
- RAG、Fine-tuning、Tool Calling 各解决什么问题？
- Embedding、向量距离和 HNSW 如何影响召回？
- 如何建立一套不会自欺欺人的 RAG 评测？
- 为什么 Prompt Injection 不能只靠 Prompt 防御？
- Workflow 和 Agent 如何选？
- 工具调用如何做权限、审批和幂等？
- 如何减少 TTFT、总延迟和单次成本？
- 如何切换模型供应商而不污染业务层？
- 如何处理会话截断和长期记忆？
- MCP 解决什么问题，又引入什么攻击面？
项目深挖
每个作品准备四种讲法：30 秒定位、3 分钟闭环、10 分钟架构、20 分钟追问。必须主动讲一个失败方案、一次性能或质量测量、一次安全边界设计和一项仍未解决的问题。
12. 简历关键词与证据映射
| 不要只写 | 改成可验证表达 |
|---|---|
| 熟悉大模型 | 设计 ModelGateway，支持模型切换、流式事件、Usage 和取消 |
| 熟悉 RAG | 建混合检索/重排/引用链和 30+ 条离线评测集 |
| 熟悉 Agent | 实现持久化 Workflow、工具审批、幂等、恢复和步数预算 |
| 熟悉性能优化 | 用真实测量写明 TTFT/P95/Bundle/长任务前后数据 |
| 熟悉微服务 | 说明服务边界、契约、Trace、重试和一致性取舍 |
| 熟悉测试 | 列出单元、契约、集成、E2E、AI Eval 与安全用例 |
| 使用 AI 提效 | 说明生成、审查、验证流程及发现过的具体错误 |
可纳入 JD 检索的词：Vue 3、Nuxt、TypeScript、Node.js、NestJS、SSR、SSE、PostgreSQL、Redis、Docker、OpenTelemetry、LLM、RAG、Embedding、Hybrid Search、Reranking、Structured Output、Tool Calling、Agent Workflow、MCP、Evaluation、Guardrails、Prompt Injection、Human-in-the-loop。
关键词必须能在项目、测试或文档中找到证据。没有实现过就不要写“精通”。
13. 投递与反馈策略
- 建岗位表：公司、行业、城市、岗位名、必需技能、加分技能、薪资、来源、进度。
- 将 JD 拆成“前端深度、全栈范围、AI 深度、业务领域、管理责任”五列。
- 同时搜索 AI 前端、智能体前端、AI 全栈、LLM 应用工程师、AI 平台前端、高级前端等标题。
- 每周定向投递 10–15 个高匹配岗位，不盲目海投。
- 每次面试后记录问题、回答、证据缺口和改进动作；两周修订一次简历。
- 优先选择能让你拥有端到端责任的团队，而不是只做聊天页面皮肤的岗位。
- 对制造、汽车、企业服务等行业，不只研究技术栈，还要准备一个业务流程案例。
14. 哪些东西现在不值得优先学
- 同时精通 Vue、React、Angular、Svelte；
- 追每个模型榜单和 Prompt 技巧；
- 在没有数据前上复杂多 Agent；
- 为小规模知识库先部署专用向量数据库；
- 没有平台岗位目标就深挖 Webpack Loader、Bundler 内核或 K8s 运维；
- 为 AI 应用岗系统学习 CUDA、分布式训练和模型预训练；
- 只为简历引入微前端、DDD、事件溯源或几十个微服务；
- 把 MCP 当成通用业务函数调用的替代品。
15. 最终验收清单
初级：能使用
- [ ] Node 24 LTS、pnpm、Docker 环境可复现；
- [ ] 能解释项目启动、SSR、API、数据库和模型配置；
- [ ] 能完成带取消的流式聊天；
- [ ] 能使用 PostgreSQL、Redis 和队列；
- [ ] 能运行单测、E2E 和 CI。
中级：能解释
- [ ] 能从浏览器讲到模型返回的完整调用链；
- [ ] 能解释 SSR/CSR/SSG、SSE/WS、缓存和鉴权取舍；
- [ ] 能解释 RAG、工具、Workflow、Agent、MCP 的区别；
- [ ] 能说明至少三项架构决策和两个失败方案；
- [ ] 能用 Trace 定位一次跨服务故障；
- [ ] 能设计离线评测和 AI 安全测试。
高级：能交付和扩展
- [ ] 两个项目有在线演示、架构图、测试、部署和 ADR；
- [ ] 知识助手有权限、混合检索、引用和评测；
- [ ] 工作流有审批、幂等、重试、恢复和审计；
- [ ] 有真实测量的质量、延迟和成本数据；
- [ ] 完成高级前端、AI 系统设计、故障排查、项目深挖四类模拟面试；
- [ ] 能在一周内根据目标 JD 做一次技术和简历定向调整。
16. 每月复盘模板
# 月度复盘
## 本月交付
- 可运行功能：
- 测试与评测：
- 文档/架构图：
## 数据
- 学习时长：
- TTFT / P95 / 错误率 / 单次成本：
- Eval 基线与变化：
## 本月真正理解的三个概念
1.
2.
3.
## 失败和修正
- 失败方案：
- 根因：
- 修正：
- 如何防回归：
## 下月只做的三件事
1.
2.
3.17. 最后的优先级
如果只能记住一条路线：
TypeScript/浏览器/网络
→ Vue/Nuxt SSR 与工程质量
→ Node/PostgreSQL/Redis/队列
→ 流式 AI UI 与模型适配
→ RAG、工具和受约束 Workflow
→ 评测、安全、可观测性
→ 两个真实作品和可量化的面试故事2027 年最危险的候选人画像是“经验很多，但只会接需求写页面”；最有竞争力的画像是“保留前端深度，同时能对一个 AI 功能从需求、架构、交互、服务、数据、模型到线上结果负责”。