HTTP缓存机制核心概念（2大类型）记忆口诀：强缓存不请求，协商缓存问一问
121. 强缓存：直接使用本地缓存，不请求服务器2. 协商缓存：询问服务器缓存是否可用
缓存流程图：
12345678910111213请求资源 ↓检查强缓存 ↓命中？ → 是 → 直接使用缓存（200 from cache） ↓ 否发送请求到服务器 ↓检查协商缓存 ↓未修改？ → 是 → 使用缓存（304 Not Modified） ↓ 否返回新资源（200 OK）
1. 强缓存（Strong Cache）1.1 Expires（HTTP/1.0）原理：
服务器返回资源的过期时间（绝对时间）
浏览器判断当前时间是否超过过期时间
未过期则直接使用缓存
响应头示例：
1Expires: Wed, 21 Oct 2026 07:28:00 GMT
缺点：
1231. 依赖客户端时间，如果客户端时间不准确会导致缓存失效2. 服务器时间和客户端时间可能不一致3. 已被Cache-Control替代
Node.js示例：
123456789const express = require ...
Web标准、语义化与兼容性核心概念（3大维度）记忆口诀：标准 → 语义 → 兼容
1231. Web标准：结构、表现、行为分离2. 语义化：用正确的标签做正确的事3. 兼容性：跨浏览器、跨设备一致体验
1. Web标准1.1 三层分离结构层（HTML）
12345678910111213<!-- 负责页面结构和内容 --><!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <title>页面标题</title></head><body> <header>头部</header> <main>主体内容</main> <footer>底部</footer></body></html>
表现层（CSS）
1234567891011/* 负责页面样式和布局 */he ...
前端安全核心威胁（6大类型）记忆口诀：XSS → CSRF → 点击劫持 → SQL注入 → 中间人攻击 → 其他
1234561. XSS（跨站脚本攻击）：注入恶意脚本2. CSRF（跨站请求伪造）：伪造用户请求3. 点击劫持：诱导用户点击4. SQL注入：注入恶意SQL5. 中间人攻击：拦截篡改数据6. 其他：DDoS、暴力破解等
1. XSS（Cross-Site Scripting）跨站脚本攻击1.1 XSS攻击类型存储型XSS（最危险）
123456789101112// 攻击场景：评论、留言板// 1. 攻击者提交恶意脚本到数据库const comment = '<script>alert(document.cookie)</script>';// 2. 其他用户访问页面时，脚本被执行<div>{comment}</div> // 直接渲染，脚本执行// 危害：// - 窃取Cookie// - 劫持用户会话// - 篡改页面内容// - 钓鱼攻击
反射型XSS
123456// ...
7. 监控体系7.1 性能监控123456789101112131415161718192021222324252627282930313233343536// 性能数据上报class PerformanceMonitor { constructor() { this.init(); } init() { window.addEventListener('load', () => { this.reportPerformance(); }); } reportPerformance() { const timing = performance.timing; const metrics = { // DNS查询时间 dns: timing.domainLookupEnd - timing.domainLookupStart, // TCP连接时间 tcp: timing.co ...
6. 版本管理6.1 语义化版本（Semantic Versioning）12345678910版本格式：主版本号.次版本号.修订号 (MAJOR.MINOR.PATCH)1.0.0 → 1.0.1 修复bug（PATCH）1.0.1 → 1.1.0 新增功能，向下兼容（MINOR）1.1.0 → 2.0.0 重大更新，不兼容（MAJOR）先行版本：1.0.0-alpha.1 内测版本1.0.0-beta.1 公测版本1.0.0-rc.1 候选版本
6.2 版本发布流程12345678910111213141516# 使用standard-version自动化版本管理npm install standard-version -D# package.json{ "scripts": { "release": "standard-version", "release:minor": "standard-version --release-as m ...
5. CI/CD自动化部署5.1 GitHub Actions12345678910111213141516171819202122232425262728293031323334353637# .github/workflows/deploy.ymlname: Deployon: push: branches: [ main ]jobs: build-and-deploy: runs-on: ubuntu-latest steps: - name: Checkout uses: actions/checkout@v2 - name: Setup Node.js uses: actions/setup-node@v2 with: node-version: '16' - name: Install dependencies run: npm ci - name: Run tests run: npm test ...
前端性能优化核心优化方向（6大维度）记忆口诀：加载 → 渲染 → 交互 → 网络 → 缓存 → 构建
1234561. 加载优化：减少资源体积，加快加载速度2. 渲染优化：减少重排重绘，提升渲染性能3. 交互优化：提升用户体验，减少卡顿4. 网络优化：减少请求次数，优化传输5. 缓存优化：合理利用缓存，减少重复请求6. 构建优化：打包体积优化，代码分割
1. 加载性能优化1.1 资源压缩123456789101112131415161718// Gzip/Brotli压缩// nginx配置gzip on;gzip_types text/plain text/css application/json application/javascript;gzip_min_length 1000;// Webpack配置const CompressionPlugin = require('compression-webpack-plugin');module.exports = { plugins: [ new CompressionPlugin( ...
JavaScript事件循环机制（Event Loop）核心流程（记忆关键）记忆口诀：同步代码 → 微任务 → 宏任务 → 微任务 → 宏任务…
执行顺序：执行栈 → 微任务队列清空 → 取一个宏任务 → 微任务队列清空 → 循环
1. 基础概念执行栈（Call Stack）
同步代码按顺序执行的地方
函数调用形成栈帧，先进后出（LIFO）
栈空时才会检查任务队列
任务队列（Task Queue）
宏任务队列（Macro Task）：script、setTimeout、setInterval、I/O、UI渲染、postMessage
微任务队列（Micro Task）：Promise.then/catch/finally、MutationObserver、process.nextTick（Node.js）
2. 事件循环完整流程12345678910111. 执行同步代码（执行栈） ↓2. 执行栈清空 ↓3. 执行所有微任务（清空微任务队列） ↓4. 渲染更新（如果需要） ↓5. 取出一个宏任务执行 ↓6. 回到步骤2（循环）
...
一、RAG（检索增强生成）⭐⭐⭐面试题1：什么是RAG？解决什么问题？标准答案（背诵版）：RAG是Retrieval-Augmented Generation的缩写，检索增强生成。它解决了LLM的三大问题：
知识过时：模型训练后无法获取最新信息
幻觉问题：模型会编造不存在的内容
领域知识缺失：通用模型缺少企业私有数据
工作流程（必背）：
1用户提问 → 向量化查询 → 检索知识库 → 拼接上下文 → LLM生成答案
面试题2：RAG的技术实现流程？标准答案：
离线阶段：
文档切片（Chunking）：将长文档切成512-1024 token的片段
向量化（Embedding）：用模型（如text-embedding-ada-002）转成向量
存储：保存到向量数据库（Pinecone/Milvus/Chroma）
在线阶段：
用户问题向量化
相似度检索（余弦相似度/欧氏距离）
Top-K召回（通常K=3-5）
构造Prompt：根据以下资料回答：[检索内容] 问题：[用户问题]
LLM生成答案
面试题3：RAG的优化策略？必背 ...
核心流程（记忆关键）记忆口诀：同步代码 → 微任务 → 宏任务 → 微任务 → 宏任务…
执行顺序：执行栈 → 微任务队列清空 → 取一个宏任务 → 微任务队列清空 → 循环
1. 基础概念执行栈（Call Stack）
同步代码按顺序执行的地方
函数调用形成栈帧，先进后出（LIFO）
栈空时才会检查任务队列
任务队列（Task Queue）
宏任务队列（Macro Task）：script、setTimeout、setInterval、I/O、UI渲染、postMessage
微任务队列（Micro Task）：Promise.then/catch/finally、MutationObserver、process.nextTick（Node.js）
2. 事件循环完整流程12345678910111. 执行同步代码（执行栈） ↓2. 执行栈清空 ↓3. 执行所有微任务（清空微任务队列） ↓4. 渲染更新（如果需要） ↓5. 取出一个宏任务执行 ↓6. 回到步骤2（循环）
关键点：
每次执行一个宏任务后，会清空所有微任务
微 ...
