Skip to content

AI Agent全栈架构

Main Navigation 首页

Agent 面试题库

智能体框架

Agent 设计模式

AI Agent 项目实战

AI 全栈实战

前端面试题库

Next.js 16 AI 全栈应用知识库

Nuxt4 AI 视频项目知识库

前端架构知识体系

Audio 音频知识库

Video 视频知识库

LangChain Python

Hono AI 项目知识体系

Zod 技术专栏

Hermes Engineering 工程知识体系

Claude Code 实践教程知识库

Codex 实践教程

AI 编程思想

AI 小白入门知识库

AI 产品出海知识库

主题

Sidebar Navigation

目录AI Agent全栈架构

1.1概览
1.2HTML 面试题
1.3CSS 面试题
1.4JavaScript 面试题
1.5React 面试题
1.6HTML5 相比于 HTML 有哪些更新？
1.7HTML 中，img 标签 srcset 属性的作用是什么？
1.8Cookie、Session、Token 之间有什么区别？
1.9前端如何处理超过 JS 的 Number 最大值的数字？
1.10如何调试和解决跨浏览器兼容性问题？
1.11如何实现网站一键切换主题的功能？
1.12前端如何判断一个点是否在 Canvas 的图形内？

2.1概览
2.3Vue 路由与导航
2.7Vue 项目实践
2.41Vue 性能优化
2.64Vue 状态管理
2.71Vue 组件化开发与设计
2.90Vue3 原理与源码

3.1概览
3.3React 组件化开发与设计
3.19React 原理与源码
3.30React 状态管理
3.35React 路由与导航
3.39React 性能优化
3.60React 项目实践

4.1概览
4.2HTTP 1.0 和 2.0 有什么区别？
4.3到底什么是 TCP 连接？
4.4HTTP 2.0 和 3.0 有什么区别？
4.5HTTP 和 HTTPS 有什么区别？
4.6TCP 是用来解决什么问题？
4.7TCP 和 UDP 有什么区别？
4.8TCP 的粘包和拆包能说说吗？
4.9说说 TCP 的三次握手？
4.10说说 TCP 的四次挥手？
4.11为什么 TCP 挥手需要有 TIME_WAIT 状态？
4.12TCP 超时重传机制是为了解决什么问题？
4.13TCP 滑动窗口的作用是什么？
4.14TCP/IP 四层模型是什么？
4.15OSI 七层模型是什么？
4.16从网络角度来看，用户从输入网址到网页显示，期间发生了什么？
4.17如何在 Node.js 中创建一个简单的 HTTP 服务器？
4.18如何在 Node.js 中处理 HTTP 请求的路由？
4.19前端项目中如何配置 HTTP 缓存机制？

5.1概览
5.3Next.js 高级架构
5.20Next.js 项目实践
5.34Next.js 原理与运行时
5.53React + Next.js 性能优化

6.1概览
6.3Nuxt 高级架构面试题
6.33Nuxt 项目实践
6.78Nuxt 性能优化
6.86Nuxt 原理与运行时

7.1概览
7.2Node.js 中，同步和异步代码有什么区别？
7.3Node.js 中的 Buffer 对象是什么？它有什么作用？
7.4Node.js 中的 process 对象是什么？它有哪些常用属性？
7.5Node.js 中的 require 和 import 有什么区别？
7.6Node.js 中的回调、Promise 和 async/await 有什么区别？
7.7Node.js 中的回调函数是什么？请举例说明。
7.8Node.js 中的定时器函数 setImmediate() 和 setTimeout() 有量什么区别？
7.9Node.js 的 process.nextTick() 有什么作用？
7.10什么是 Node.js 中的事件发射器（EventEmitter）？它有什么作用？如何使用？
7.11什么是 Node.js 中的事件循环？
7.12什么是 Node.js 中的模块加载机制？
7.13什么是 Node.js 全局对象？有哪些全局对象？
7.14什么是 Node.js 的事件循环机制？它是怎么实现的？
7.15什么是 package.json 文件？它的作用是什么？
7.16什么是非阻塞 I/O？Node.js 如何实现非阻塞 I/O？
7.17如何在 Node.js 中解析 JSON 数据？
7.18如何在 Node.js 中进行高效的日志处理，避免影响性能？

8.1概览
8.2请用一句话概括，什么是设计模式？为什么要用？
8.3谈谈你了解的最常见的几种设计模式，说说他们的应用场景。
8.4什么是策略模式？一般用在什么场景？
8.5什么是模板方法模式？一般用在什么场景？
8.6什么是代理模式？一般用在什么场景？
8.7什么是原型模式？一般用在什么场景？
8.8请描述简单工厂模式的工作原理。

9.1概览
9.2前端开发中的 Live-Reload 自动刷新与 HMR 热模块替换有什么区别？
9.3如何使用 Webpack 处理内联 CSS？
9.4如何使用 Webpack 解决开发环境中的跨域问题？
9.5前端开发中如何优化网络请求和资源加载？具体怎么实现？
9.6如何使用 Webpack 优化产出代码？
9.7Webpack 中，常见的图片处理加载器有哪些？
9.8如何使用 Webpack 和 LocalStorage 实现静态资源的离线缓存？
9.9什么是 Webpack？它有什么作用？
9.10如何使用 Webpack 进行前端性能优化？
9.11如何在 Webpack 中实现条件组件的按需打包？
9.12前端如何使用 Webpack 进行高效分包优化？
9.13前端项目中资源的缓存配置策略有哪些？
9.14如何优化 Webpack 打包后文件的体积？
9.15同一前端页面的 3 个组件请求同一个 API 并发送了 3 次请求，如何优化？
9.16什么是 Webpack 的 bundle、chunk 和 module？分别有什么作用？
9.17Webpack 插件底层的实现原理是什么？
9.18Core Web Vitals 是什么？它包括哪些指标？
9.19使用 Import 时，Webpack 如何处理 node_modules 中的依赖？
9.20Webpack 中的 bundle、chunk 和 module 是什么？请分别介绍。
9.21常见的 Webpack Loader 有哪些？
9.22Webpack 和 Rollup、Parcel 构建工具有什么区别？各自的优缺点是什么？
9.23如何使用 webpack-dev-server 监控文件编译？
9.24如何优化 Webpack 的打包速度？

10.1概览
10.2如何解决前端 SPA 应用首屏加载速度慢的问题？
10.3如何设计一款能够统计前端页面请求耗时的工具？
10.4如何设计和优化秒杀系统的前端？
10.5如何在前端页面无限滚动加载内容时自动回收上面的内容？
10.6如何在前端实现文件的断点续传，并确保大文件安全可靠上传？
10.7有哪些常用的前端性能分析工具？
10.8有哪些前端网站性能优化的关键点？
10.9前端项目中，如何优化首屏渲染时间？
10.10前端如何处理后端接口一次性返回的超大树形结构数据？
10.11如何在页面内一次性渲染 10 万条数据，并保证页面不卡顿？
10.12如何在浏览器中执行 100 万个任务，并保证页面不卡顿？
10.13在网页中有大量图片时，如何优化图像加载以提高页面加载速度？
10.14如何检测 CSS 动画的 FPS 值？
10.15CSS 优化和提高性能的方法有哪些？
10.16说说你对 CSS Sprites 的理解。
10.17为什么有时候用 translate 来改变位置而不是定位？
10.18在前端开发中，如何优化网页的加载性能和渲染性能？请提供一些常见的优化策略和技巧？
10.19如何实现前端页面第一次加载不触发请求，但后续每次进入页面都触发？
10.20如何在前端实现网页截图功能？可以将某部分或整个页面的内容保存为图片。
10.21前端页面白屏的原因可能是什么，如何排查？
10.22如何对前端应用中静态资源加载失败的场景进行降级处理？
10.23如何使用节流或防抖技术优化频繁触发请求的搜索输入框？

11.1概览
11.2如何解决页面请求接口大规模并发问题？
11.3前端如何实现扫码登录功能？
11.4什么是单点登录，前端如何实现单点登录？
11.5前端如何实现基于 WebSocket 的实时聊天功能，支持多用户在线聊天并展示消息通知？
11.6你会如何设计前端日志埋点 SDK？
11.7前端如何给网页增加水印？并且如何防止水印被移除？
11.8如何在前端实现一个实时自动补全搜索框？
11.9如何在前端实现国际化，并根据用户设置自动切换语言？
11.10常见的登录鉴权方式有哪些？各自的优缺点是？
11.11如何在前端防止表单重复提交，并确保用户只能提交一次？
11.12如何设计一个前端页面，实现 PC 端访问展示 Web 应用，移动端访问展示 H5 应用？
11.13如何禁止别人调试前端页面代码？
11.14如何定位到前端页面发生错误的元素？
11.15如何对每个 JavaScript 函数的执行实现拦截？

前端面试题库

概览

前端基础面试题

概览

HTML 面试题

CSS 面试题

JavaScript 面试题

React 面试题

HTML5 相比于 HTML 有哪些更新？

HTML 中，img 标签 srcset 属性的作用是什么？

Cookie、Session、Token 之间有什么区别？

前端如何处理超过 JS 的 Number 最大值的数字？

如何调试和解决跨浏览器兼容性问题？

如何实现网站一键切换主题的功能？

前端如何判断一个点是否在 Canvas 的图形内？

Vue 面试题

概览

Vue 路由与导航

概览

你在项目中使用了 Vue Router 全局路由守卫，请解释一下路由守卫的概念和用法，并介绍一下它在你项目中的实际应用场景？

如何自主设计实现一个 Vue 路由系统？

Vue 项目实践

概览

如何在 Vue 中实现权限管理？如何控制权限到按钮级别？

你会如何从零构建一个 Vue 项目？要经历哪些步骤？目录结构如何设计？使用哪些库或插件？

Vue 首页白屏可能是什么问题引起的？如何解决？

在 Vue 开发过程中需要同时与多个后端人员联调接口时，你会怎么做？

使用 Vue 开发一个任务列表应用，你会怎么设计实现？

大型 Vue 项目如何做分层架构和依赖治理？

Vue 项目按页面、按功能还是按领域组织目录？如何做选择？

Vue 项目如何设计统一 API Client、错误模型和请求取消？

Vue 项目如何设计登录会话、Token 刷新和多标签页同步？

Vue 项目如何实现动态路由权限，并处理刷新、退出和权限变更？

大型 Vue 项目如何划分 Pinia Store，并设计持久化边界？

Vue 后台列表页如何设计 URL 状态、筛选、分页和返回恢复？

Vue 项目如何设计复杂表单、草稿保存和分步校验？

Vue 项目如何实现乐观更新，并保证失败回滚和重复提交安全？

Vue 项目如何设计大文件分片、断点续传和上传任务管理？

Vue 项目如何设计 WebSocket 重连、心跳和实时状态同步？

Vue 应用如何设计离线可用、缓存和重新联网同步？

Vue 项目如何做国际化、语言包拆分和动态切换？

Vue 项目如何设计主题、设计 Token 和运行时换肤？

Vue SaaS 项目如何实现多租户和白标定制？

Vue 项目什么时候需要微前端？如何处理路由、样式和通信？

如何为 Vue 项目设计插件体系，避免业务代码和平台能力耦合？

Vue 线上异常如何分层捕获、上报和恢复？

Vue 项目如何设计埋点、性能指标和隐私合规边界？

大型 Vue 项目如何设计单元、组件、契约和 E2E 测试分层？

Vue 项目如何在 CI 中建立类型、测试、构建和性能质量门禁？

Vue 前端项目如何设计灰度发布、版本回滚和静态资源缓存？

大型 Vue2 项目迁移 Vue3，如何拆阶段、控风险和验证收益？

Vue 项目如何用 TypeScript 建立 API、表单和组件契约？

Vue 项目如何处理 XSS、CSRF、富文本和不可信配置？

Vue 项目如何接入地图、支付或编辑器等第三方 SDK，并控制副作用？

Vue 项目如何把大计算、解析和导出任务移到 Worker？

Vue 性能优化

概览

如何建立 Vue 应用的性能预算和持续回归机制？

Vue 性能问题应该如何区分加载性能、更新性能和运行时性能？

Vue3 中如何通过 shallowRef、shallowReactive 和 markRaw 控制响应式成本？

computed 稳定性如何影响 Vue3 组件更新？

Vue 组件为什么会被不必要地更新？如何优化父子组件更新传播？

v-once、v-memo 和静态提升分别适合什么场景？

Vue 中深度 watch 为什么可能造成严重性能问题？如何替代？

Vue 中 watch 的 flush 时机如何影响性能和布局？

Vue 事件处理和渲染函数中如何避免大量临时对象与函数分配？

Vue 页面频繁更新时，如何避免布局抖动和强制同步布局？

Vue 中的高频输入、滚动和拖拽如何设计，才能改善 INP？

Vue 项目中哪些计算应该放到 Web Worker？如何设计数据传输？

Vue 组件库如何避免主题、图标和 CSS 设计导致的运行时性能问题？

如何定位 Vue 页面内存泄漏，并建立卸载后的资源治理？

有哪些 Vue 性能优化的方法？

使用 Vue 渲染大量数据时，如何进行优化？

如何解决 Vue 打包时 vendor 文件过大的问题？

如何解决 SPA 单页应用首屏加载速度慢的问题？

Vue 如何优化网站首页的加载速度？

如何优化 Webpack 打包 Vue 应用的速度？

如何解决 Vue 初始化页面闪动的问题？

Vue 状态管理

概览

Pinia 与 Vuex 状态管理有什么区别？

Vuex 的实现原理是什么？

Vuex 状态管理存在什么缺点？

如何实现 Vuex 中 store 的插件？

什么是 Vuex 的模块化 module？有哪些应用场景？

Vue 组件化开发与设计

概览

Vue 组件的 API 契约应该如何设计，才能兼顾易用性、可维护性和可扩展性？

如何设计一个可复用的 Vue3 复杂弹窗、Popover 或下拉浮层组件？

什么是 Headless Component？在 Vue 组件库中什么时候应该采用？

如何从零设计一套 Vue3 企业级组件库的架构？

Vue 组件库如何设计主题系统，支持换肤、暗色模式和业务定制？

Vue3 组件如何设计受控、非受控和半受控状态？

如何用 provide/inject 设计 Vue 复合组件？有哪些边界？

Vue 中 slots、renderless component 和 composable 应该如何选择？

如何让 Vue 组件具备可扩展性，而不是不断增加 if/else？

如何设计可维护的 Vue3 Form、FormItem 和 Field 组件体系？

如何设计支持大数据量、虚拟滚动和异步展开的 Vue Table 或 Tree 组件？

如何在 Vue 组件库中系统性实现可访问性？

Vue 组件库如何做版本管理、兼容性治理和渐进式迁移？

如何判断 Vue 组件应该拆多大？状态应该由谁拥有？

如何设计支持插件、主题和业务扩展的 Vue 组件库运行时？

如何为复杂 Vue 组件和组件库设计测试策略？

Vue3 组件库如何处理异步组件、懒加载和错误降级？

Vue3 原理与源码

概览

Vue3 的 reactive、ref 为什么基于 Proxy 和 getter/setter？

Vue3 响应式系统如何完成依赖收集和触发更新？

computed、watch 和 watchEffect 在 Vue3 内部有什么区别？

Vue3 的 effectScope 解决了什么问题？它和组件生命周期如何协作？

Vue3 scheduler 如何合并更新、控制 flush 时机和避免重复执行？

Vue3 渲染器从 render effect 到真实 DOM patch 经历了什么？

Vue3 keyed diff 的核心流程是什么？为什么会有最长递增子序列？

Vue3 模板编译器的 parse、transform、codegen 分别做什么？

Vue3 的 Patch Flags、静态提升和 Block Tree 如何协同优化更新？

Vue3 组件实例是如何创建的？setup、render effect 和生命周期如何衔接？

Vue3 slots 在编译和运行时是如何实现的？为什么 slot 内容由父组件作用域渲染？

Vue3 的 v-model 在组件上是如何从编译器变成 props 和 emits 的？

KeepAlive 的缓存原理是什么？include、exclude 和 max 如何影响组件生命周期？

Teleport 的实现原理是什么？它为什么能改变 DOM 位置但不改变组件逻辑关系？

Suspense 如何协调 async setup、异步组件和 fallback？生产中有哪些边界？

script setup、defineProps、defineEmits 等 Vue3 编译宏是如何工作的？

Vue 2 和 Vue 3 有哪些区别？Vue 3 有哪些更新？

Vue 3 的设计目标是什么？在设计过程中做了哪些优化？

Vue 3 性能提升主要体现在哪些方面？

React 面试题

概览

React 组件化开发与设计

概览

如何划分 React 组件边界，避免“大组件”和“碎片化”？

受控组件、非受控组件和混合模式如何设计？

children、render props 和复合组件分别解决什么问题？

如何设计一个可复用的表单或弹窗组件？

自定义 Hook 如何抽象，怎样避免“万能 Hook”？

React 闭包陷阱、effect 依赖和事件处理如何治理？

React 并发特性下，如何处理高优先级和低优先级更新？

如何让 React 组件具备可测试性和可观测性？

如果 React 组件的属性没有传值，它的默认值是什么？

React 中除了在构造函数中绑定 this，还有其他绑定 this 的方式么？

在 React 的 render 函数中，是否可以直接写 if else 判断？为什么？

如何在 React 项目中引入图片？哪种方式更好？

在 React 的 JSX 中，属性是否可以被覆盖？覆盖的原则是什么？

什么是 React 中的受控组件？它的应用场景是什么？

React 原理与源码

概览

Fiber 解决了什么问题？它和虚拟 DOM 有什么区别？

React 一次更新从哪里开始，到哪里结束？

React Reconciliation 的主要启发式规则是什么？

Scheduler、Lane 和优先级分别是什么？

Hooks 为什么必须按固定顺序调用？

React 如何通过 flags 完成 DOM 提交？

Suspense、Lazy 和错误边界在运行时如何协作？

React Server Components 和客户端组件的边界是什么？

如何阅读 React 源码并验证自己的理解？

React 状态管理

概览

useState、useReducer 的更新队列如何工作？

Context 适合存什么，如何控制它带来的重渲染？

Redux 如何实现多个组件之间的通信？多个组件使用相同状态时如何进行管理？

React 路由与导航

概览

在 React Router 的 history 模式中，push 和 replace 方法有什么区别？

React Router 中的 Router 组件有几种类型？

React 性能优化

概览

如何使用 React Profiler 定位组件性能问题？

React 组件为什么会重渲染？如何系统减少无效重渲染？

为什么状态下沉和状态就近放置能提升 React 性能？

memo、useMemo、useCallback 应该什么时候用？

React 大列表为什么需要虚拟化？如何设计虚拟列表？

React 超大表格如何优化渲染和交互性能？

React 代码分割、lazy 和 Suspense 如何配合优化首屏？

React Compiler 会如何影响手动性能优化？

startTransition 和 useDeferredValue 如何改善 React 交互性能？

React 应用如何建立 Web Vitals 和 RUM 性能体系？

React 应用如何消除数据请求瀑布并设计请求缓存？

React 页面出现长任务和交互卡顿时如何优化？

React 应用如何排查内存泄漏和 effect 清理问题？

React 应用如何优化图片、字体和静态资源加载？

React SSR 应用如何优化 hydration 性能和一致性？

React 应用中的布局抖动和掉帧如何排查？

如何为 React 项目建立性能预算和回归门禁？

为什么在 React 中遍历时不建议使用索引作为唯一的 key 值？

为什么 React 使用虚拟 DOM 来提高性能？

React 项目实践

概览

如何设计大型 React 项目的目录和模块边界？

如何设计 React 应用的权限、角色和多租户隔离？

React 项目如何管理服务端状态和请求缓存？

如何设计复杂表单和异步提交链路？

如何设计 React 组件库和 Design System？

如何实现 React 应用的国际化和主题切换？

如何搭建 React 项目的测试体系？

如何建设 React 项目的错误监控和性能观测？

如何优化 React 项目的构建、发布和回滚？

如何把遗留 React 应用渐进式迁移到现代架构？

React AI 聊天界面如何消费流式响应？

AI 流式消息如何设计增量状态更新？

AI 生成如何实现停止、取消、重试和断线恢复？

React 多会话 AI Chat 如何隔离状态避免串线？

AI Markdown、代码块和工具结果如何安全渲染？

React 如何实现结构化输出驱动的动态 UI？

AI Tool Calling 的确认、审批和执行状态如何设计？

RAG 引用、来源和无答案状态如何设计前端交互？

AI 对话历史、草稿和分支会话如何持久化？

AI 应用如何保证幂等、重复提交和消息顺序？

React AI 应用如何防御 Prompt Injection 和恶意文件？

如何建设 AI 前端的成本、延迟和质量观测体系？

React AI 多模态输入和文件上传如何设计？

AI 生成内容的编辑、版本、撤销和人工审核如何实现？

AI 应用如何设计模型 fallback、离线降级和错误恢复？

React AI 长文本和长列表如何优化性能？

网络协议面试题

概览

HTTP 1.0 和 2.0 有什么区别？

到底什么是 TCP 连接？

HTTP 2.0 和 3.0 有什么区别？

HTTP 和 HTTPS 有什么区别？

TCP 是用来解决什么问题？

TCP 和 UDP 有什么区别？

TCP 的粘包和拆包能说说吗？

说说 TCP 的三次握手？

说说 TCP 的四次挥手？

为什么 TCP 挥手需要有 TIME_WAIT 状态？

TCP 超时重传机制是为了解决什么问题？

TCP 滑动窗口的作用是什么？

TCP/IP 四层模型是什么？

OSI 七层模型是什么？

从网络角度来看，用户从输入网址到网页显示，期间发生了什么？

如何在 Node.js 中创建一个简单的 HTTP 服务器？

如何在 Node.js 中处理 HTTP 请求的路由？

前端项目中如何配置 HTTP 缓存机制？

Next.js 面试题

概览

Next.js 高级架构

概览

Next.js 鉴权应该放在哪里？

Route Handler、BFF 和直接调用后端如何选择？

如何设计日志、监控和线上排障？

如何迁移和治理 Next.js 大型项目？

如何设计部署、灰度和回滚？

Next.js 多租户和多区域部署如何隔离域名、缓存和数据？

Next.js 长耗时任务、后台任务和连接池如何治理？

Next.js 如何实现 CSP、nonce 和第三方脚本治理？

Next.js 如何防止动态数据进入公共缓存造成越权？

Next.js Multi-Zones 如何支持大型组织的渐进式拆分？

Next.js standalone 和自托管如何设计运行时边界？

Next.js Webhook 如何做签名校验、幂等和重放防护？

Next.js 如何设计限流、配额和滥用防护？

Next.js 环境变量、Secret 和运行时配置如何治理？

Next.js 如何防御开放重定向和 SSRF？

Next.js 项目实践

概览

如何设计一个 Next.js 中后台项目的目录和模块边界？

如何设计登录、session、租户和权限系统？

如何实现一个可靠的表单提交流程？

如何在 Next.js 中实现搜索、分页、排序和筛选？

如何实现文件上传和大文件处理？

如何接入 SSE、WebSocket 或流式 AI 响应？

如何做国际化、主题和可访问性？

如何搭建 Next.js 的测试体系？

如何用 Next.js 设计生产级 AI 对话应用的整体架构？

Next.js AI 对话如何实现流式输出、恢复和取消？

Next.js AI 知识库如何实现上传、解析和异步索引？

Next.js AI Agent 如何设计工具调用、审批和幂等执行？

Next.js 原理与运行时

概览

App Router 和 Pages Router 的核心差异是什么？

Server Component 和 Client Component 如何划分？

Next.js 中如何选择数据获取位置？

Next.js 的缓存层如何区分？

Server Actions 适合什么，不适合什么？

Next.js 路由、布局和错误边界如何组织？

如何处理静态、动态、边缘和 Node.js 运行时？

Next.js 请求如何从入口走到 RSC、Flight 和客户端 Hydration？

Next.js 16 的 Cache Components 和 use cache 如何工作？

Next.js Proxy 与鉴权、重写和运行时边界如何设计？

Server Actions 的序列化、安全和执行语义是什么？

Next.js 动态路由和 generateStaticParams 如何协同？

Next.js generateMetadata 如何处理动态 SEO 和元数据流式输出？

Next.js cookies 和 headers 为什么会影响动态渲染？

Next.js redirect、notFound 和 error.js 如何划分？

Next.js Draft Mode 如何实现 CMS 预览而不污染正式缓存？

Next.js Static Export 适合什么场景，又有哪些限制？

React + Next.js 性能优化

概览

如何建立 React + Next.js 性能指标体系？

Server Components、SSR、SSG 和 CSR 如何影响性能？

如何定位并消除 Next.js 数据请求瀑布？

如何优化客户端 bundle 和 hydration？

React 列表、表格和大组件如何优化？

Next.js 图片、字体和静态资源如何优化？

如何优化缓存、预取和 revalidation？

如何优化 INP 和 React 交互响应？

如何优化 LCP、TTFB 和服务端性能？

如何建立性能回归和预算治理？

Nuxt 面试题

概览

Nuxt 高级架构面试题

概览

Nuxt Layers 如何用于大型团队的多应用复用和架构隔离？

Nuxt app.config 和 runtimeConfig 有什么本质区别？

Nuxt 错误处理体系如何设计，才能区分页面错误、API 错误和系统故障？

Nuxt server middleware、route middleware 和 Nitro plugin 的执行边界有什么不同？

Nuxt 中如何实现流式 SSR 或流式接口，并处理客户端渐进展示？

Nuxt + Nitro 如何处理 WebSocket、SSE 和长连接部署？

Nuxt 服务端如何管理数据库连接池，避免 Serverless 和热重载下连接泄漏？

Nuxt 中如何防止 SSR 缓存、payload 和 CDN 造成跨用户数据泄露？

Nuxt 如何设计幂等、重试和超时，避免 SSR 请求放大上游故障？

Nuxt 多租户应用如何设计请求上下文、缓存 key 和主题隔离？

Nuxt 如何设计灰度发布、Feature Flag 和 SSR 一致性？

Nuxt 如何测试 SSR、hydration、Nitro API 和浏览器交互的完整链路？

Nuxt 如何做构建产物分析和依赖治理，定位“首屏没有变快”的原因？

Nuxt 大型项目如何处理版本升级、Nuxt 迁移和模块兼容？

Nuxt 中如何设计请求级缓存、共享缓存和进程内缓存的边界？

Nuxt 如何防御 SSRF、XSS、CSRF 和开放重定向？

Nuxt 如何实现内容安全策略 CSP，并处理 nonce、预渲染和第三方脚本？

Nuxt 如何支持大文件上传、断点续传和服务端流式处理？

Nuxt 如何处理后台任务、定时任务和长耗时任务？

Nuxt 如何实现多区域部署和数据就近访问？

Nuxt 如何设计可插拔的数据访问层，避免页面组件绑定具体后端 API？

Nuxt 如何设计可观测的缓存命中、渲染模式和上游请求指标？

Nuxt 如何设计渐进式迁移：从 Vue SPA 或 Nuxt 2 迁移到 Nuxt 3/4？

Nuxt 页面级缓存和 API 级缓存如何避免重复缓存与失效不一致？

Nuxt 如何处理资源版本不一致导致的 chunk load error？

Nuxt 如何利用页面和组件级懒加载降低资源成本，同时避免交互延迟？

Nuxt 如何设计可回滚的发布和缓存失效流程？

Nuxt 如何实现页面级 Feature Module，并控制模块对应用的侵入性？

Nuxt 项目实践

概览

如何为一个中大型 Nuxt 项目选择 SSR、SSG、ISR、CSR 和混合渲染？

Nuxt 中 useFetch、useAsyncData 和 $fetch 应该如何选择？

如何在 Nuxt 中设计服务端 API 层，避免前端直接暴露后端服务？

Nuxt 项目如何实现 SSR 场景下安全可靠的登录鉴权？

Nuxt 中间件如何设计登录、权限和多租户路由控制？

Nuxt 如何管理 runtimeConfig、环境变量和多环境部署？

Nuxt Nitro server routes 如何组织错误处理、鉴权、日志和返回契约？

如何在 Nuxt 中设计 SSR 数据的缓存、失效和一致性策略？

Nuxt 应用如何实现国际化、SEO 和多语言路由？

如何设计 Nuxt 的插件、composable 和模块边界？

如何把 Nuxt 应用部署到 Node、Serverless、Edge 和静态托管？

Nuxt 项目如何建立错误监控、性能监控和可观测性？

如何用 Nuxt 设计一个生产级 AI 对话应用的整体架构？

Nuxt 如何实现 AI 对话的流式输出，SSE 和 WebSocket 怎么选择？

AI 流式响应中途断开，Nuxt 应用如何支持恢复、重放和取消？

Nuxt AI 聊天如何设计会话持久化、并发发送和消息顺序？

Nuxt AI 应用如何设计多模型 Provider 抽象、路由和降级？

Nuxt AI 项目如何管理 Prompt、模型参数和版本回滚？

如何用 Nuxt 实现 AI 知识库上传、解析、切分和索引任务？

Nuxt AI RAG 应用如何展示引用，并保证检索结果的权限隔离？

Nuxt AI Agent 如何设计工具调用、权限确认和人工审批？

Nuxt 如何展示多步骤 Agent 的进度、状态和中间结果？

Nuxt AI 应用如何保证结构化输出可解析、可校验和可降级？

Nuxt AI 应用如何设计图片、PDF、音频等多模态输入？

Nuxt AI SaaS 如何做用户、组织、租户和会话的安全隔离？

Nuxt AI 应用如何做限流、配额、Token 预算和成本控制？

Nuxt AI 应用如何防御 Prompt Injection、越权工具调用和数据外泄？

Nuxt AI 应用如何处理隐私、脱敏、数据保留和模型训练开关？

Nuxt AI 应用如何缓存模型响应，又如何避免缓存错误和隐私泄露？

Nuxt AI 应用如何处理长耗时 Agent、批量生成和异步任务？

Nuxt AI 聊天如何管理上下文窗口、摘要记忆和长期记忆？

Nuxt AI 搜索或 RAG 应用如何设计查询改写、检索状态和无答案体验？

Nuxt AI 应用如何建立 Trace、评估集和线上质量监控？

如何测试 Nuxt AI 应用的流式响应、工具调用和模型不确定性？

Nuxt AI 应用如何设计模型超时、限流、解析失败和 provider 故障降级？

AI 内容站点在 Nuxt 中如何平衡 SSR、SEO、个性化和缓存？

Nuxt AI 应用部署到 Node、Serverless 或 Edge 时如何做选型？

Nuxt AI 应用如何接入 MCP 或外部工具，并控制工具发现与权限？

Nuxt AI 应用如何设计可查看、可编辑、可删除的用户记忆？

Nuxt AI 聊天页面如何优化流式渲染、Hydration 和长消息性能？

Nuxt AI 对话产品如何做好国际化、可访问性和多模态反馈？

Nuxt AI 功能如何做灰度、评估门禁和可回滚发布？

Nuxt AI 应用如何把用户反馈转成可迭代的质量闭环？

Nuxt 性能优化

概览

Nuxt SSR 页面 TTFB 很高，如何系统定位和优化？

如何优化 Nuxt 的 hydration 成本和 INP？

Nuxt payload 过大导致首屏慢，如何治理？

Nuxt 如何通过 routeRules、Nitro cache 和 CDN 优化内容型网站？

Nuxt 图片和字体如何优化，改善 LCP 和 CLS？

Nuxt 应用出现客户端数据瀑布，如何重构数据获取？

Nuxt 原理与运行时

概览

Nuxt 的文件约定是如何生成路由、组件自动导入和服务端入口的？

Nuxt SSR 请求从进入服务器到返回 HTML 经历了什么？

Nuxt hydration 的原理是什么？常见 mismatch 原因有哪些？

Nuxt payload 和 static payload 是如何减少重复数据请求的？

Nuxt routeRules 如何影响渲染、缓存和部署？

Nitro 为什么能让 Nuxt 部署到多种运行环境？

Nuxt 插件系统如何排序、注入和处理 server/client 差异？

Nuxt 模块系统解决了什么问题？如何编写一个可维护的 Nuxt Module？

Nuxt auto-import 的实现和风险是什么？

Nuxt 的 composable 如何做到 SSR 安全和请求上下文隔离？

Node.js 面试题

概览

Node.js 中，同步和异步代码有什么区别？

Node.js 中的 Buffer 对象是什么？它有什么作用？

Node.js 中的 process 对象是什么？它有哪些常用属性？

Node.js 中的 require 和 import 有什么区别？

Node.js 中的回调、Promise 和 async/await 有什么区别？

Node.js 中的回调函数是什么？请举例说明。

Node.js 中的定时器函数 setImmediate() 和 setTimeout() 有量什么区别？

Node.js 的 process.nextTick() 有什么作用？

什么是 Node.js 中的事件发射器（EventEmitter）？它有什么作用？如何使用？

什么是 Node.js 中的事件循环？

什么是 Node.js 中的模块加载机制？

什么是 Node.js 全局对象？有哪些全局对象？

什么是 Node.js 的事件循环机制？它是怎么实现的？

什么是 package.json 文件？它的作用是什么？

什么是非阻塞 I/O？Node.js 如何实现非阻塞 I/O？

如何在 Node.js 中解析 JSON 数据？

如何在 Node.js 中进行高效的日志处理，避免影响性能？

设计模式面试题

概览

请用一句话概括，什么是设计模式？为什么要用？

谈谈你了解的最常见的几种设计模式，说说他们的应用场景。

什么是策略模式？一般用在什么场景？

什么是模板方法模式？一般用在什么场景？

什么是代理模式？一般用在什么场景？

什么是原型模式？一般用在什么场景？

请描述简单工厂模式的工作原理。

前端工程化面试题

概览

前端开发中的 Live-Reload 自动刷新与 HMR 热模块替换有什么区别？

如何使用 Webpack 处理内联 CSS？

如何使用 Webpack 解决开发环境中的跨域问题？

前端开发中如何优化网络请求和资源加载？具体怎么实现？

如何使用 Webpack 优化产出代码？

Webpack 中，常见的图片处理加载器有哪些？

如何使用 Webpack 和 LocalStorage 实现静态资源的离线缓存？

什么是 Webpack？它有什么作用？

如何使用 Webpack 进行前端性能优化？

如何在 Webpack 中实现条件组件的按需打包？

前端如何使用 Webpack 进行高效分包优化？

前端项目中资源的缓存配置策略有哪些？

如何优化 Webpack 打包后文件的体积？

同一前端页面的 3 个组件请求同一个 API 并发送了 3 次请求，如何优化？

什么是 Webpack 的 bundle、chunk 和 module？分别有什么作用？

Webpack 插件底层的实现原理是什么？

Core Web Vitals 是什么？它包括哪些指标？

使用 Import 时，Webpack 如何处理 node_modules 中的依赖？

Webpack 中的 bundle、chunk 和 module 是什么？请分别介绍。

常见的 Webpack Loader 有哪些？

Webpack 和 Rollup、Parcel 构建工具有什么区别？各自的优缺点是什么？

如何使用 webpack-dev-server 监控文件编译？

如何优化 Webpack 的打包速度？

前端性能优化面试题

概览

如何解决前端 SPA 应用首屏加载速度慢的问题？

如何设计一款能够统计前端页面请求耗时的工具？

如何设计和优化秒杀系统的前端？

如何在前端页面无限滚动加载内容时自动回收上面的内容？

如何在前端实现文件的断点续传，并确保大文件安全可靠上传？

有哪些常用的前端性能分析工具？

有哪些前端网站性能优化的关键点？

前端项目中，如何优化首屏渲染时间？

前端如何处理后端接口一次性返回的超大树形结构数据？

如何在页面内一次性渲染 10 万条数据，并保证页面不卡顿？

如何在浏览器中执行 100 万个任务，并保证页面不卡顿？

在网页中有大量图片时，如何优化图像加载以提高页面加载速度？

如何检测 CSS 动画的 FPS 值？

CSS 优化和提高性能的方法有哪些？

说说你对 CSS Sprites 的理解。

为什么有时候用 translate 来改变位置而不是定位？

在前端开发中，如何优化网页的加载性能和渲染性能？请提供一些常见的优化策略和技巧？

如何实现前端页面第一次加载不触发请求，但后续每次进入页面都触发？

如何在前端实现网页截图功能？可以将某部分或整个页面的内容保存为图片。

前端页面白屏的原因可能是什么，如何排查？

如何对前端应用中静态资源加载失败的场景进行降级处理？

如何使用节流或防抖技术优化频繁触发请求的搜索输入框？

前端项目实践面试题

概览

如何解决页面请求接口大规模并发问题？

前端如何实现扫码登录功能？

什么是单点登录，前端如何实现单点登录？

前端如何实现基于 WebSocket 的实时聊天功能，支持多用户在线聊天并展示消息通知？

你会如何设计前端日志埋点 SDK？

前端如何给网页增加水印？并且如何防止水印被移除？

如何在前端实现一个实时自动补全搜索框？

如何在前端实现国际化，并根据用户设置自动切换语言？

常见的登录鉴权方式有哪些？各自的优缺点是？

如何在前端防止表单重复提交，并确保用户只能提交一次？

如何设计一个前端页面，实现 PC 端访问展示 Web 应用，移动端访问展示 H5 应用？

如何禁止别人调试前端页面代码？

如何定位到前端页面发生错误的元素？

如何对每个 JavaScript 函数的执行实现拦截？

本页大纲

Vue 路由与导航

路由守卫、权限前置、导航状态和路由系统设计。

本章内容

你在项目中使用了 Vue Router 全局路由守卫，请解释一下路由守卫的概念和用法，并介绍一下它在你项目中的实际应用场景？
如何自主设计实现一个 Vue 路由系统？

最后更新:

Pager

上一篇Vue 面试题

下一篇你在项目中使用了 Vue Router 全局路由守卫，请解释一下路由守卫的概念和用法，并介绍一下它在你项目中的实际应用场景？

上一篇 · Vue 面试题概览下一篇 · Vue 面试题你在项目中使用了 Vue Router 全局路由守卫，请解释一下路由守卫的概念和用法，并介绍一下它在你项目中的实际应用场景？

基于 MIT 协议开源

Copyright © 2026 AI Agent全栈架构