主题
IT 英语：通用术语与前端高频词
一、开发通用术语（不分前后端都认识）
| 英文 | 发音 | 中文 | 说明 / 常见场景 |
|---|---|---|---|
| Environment | 环境 | dev（开发）/ test（测试）/ staging（预发布）/ prod（生产） | |
| Deploy / Deployment | 部署 | "Deploy to production"=发布生产 | |
| Release | 发布（版本） | v1.2.0 release、release notes（版本说明） | |
| Build | 构建 | npm run build、build failed（构建失败） | |
| Compile | 编译 | TS 编译成 JS、Java 编译成 class | |
| Bundle | 打包 / 包 | webpack bundle、bundle size（包体积） | |
| Cache | 缓存 | clear cache、browser cache、CDN cache | |
| Session | 会话 | session expired（会话过期，需重新登录） | |
| Token | 令牌 / 凭证 | access token、refresh token、invalid token | |
| Credentials | /krəˈdenʃəlz/ | 凭证 / 账号密码 | invalid credentials（账号密码错） |
| Permission | 权限 | permission denied（没有权限）、admin permission | |
| Role | 角色 | admin role / user role / guest role | |
| Request | 请求 | send request、request failed、request body | |
| Response | 响应 | response status、response body、empty response | |
| Payload | /ˈpeɪloʊd/ | 载荷 / 请求体 | 同 request body，接口里传的数据 |
| Header | 请求头 / 响应头 | HTTP header、Content-Type header | |
| Parameter / Param | 参数 | query param、path param、required param | |
| Endpoint | 接口端点 | REST API endpoint = 一个 URL + Method | |
| Route | 路由 | frontend route、404 route not found | |
| Redirect | 重定向 | 302 redirect、redirect to login page | |
| Timeout | 超时 | request timeout、connection timeout（排查网络/服务挂了） | |
| Retry | /ˌriːˈtraɪ/ | 重试 | auto retry、retry 3 times |
| Throttle | /ˈθrɒtl/ | 节流 | 接口限流（1 秒最多 10 次请求） |
| Debounce | /dɪˈbaʊns/ | 防抖 | 搜索输入框防抖（停手 300ms 再请求） |
| Validate / Validation | /ˈvælɪdeɪt/ | 校验 | form validation（表单校验）、validation failed |
| Exception | 异常 | throw exception、catch exception、uncaught exception | |
| Stack Trace | /stæk treɪs/ | 堆栈追踪 | 报错里的一堆调用路径，看最上面第一行就是出错位置 |
| Log / Logger | 日志 | error log、check the logs（查日志） | |
| Snippet | /ˈsnɪpɪt/ | 代码片段 | VS Code snippet、常用代码片段 |
| Chunk | /tʃʌŋk/ | 块 / 分块 | webpack chunk（分包后的一个个块）、chunk split |
| Minify / Uglify | 压缩 / 混淆 | minified JS（去掉空格改名后的压缩代码） | |
| Obfuscate | /ˈɒbfəskeɪt/ | 混淆 | 反爬虫混淆代码 |
| Source Map | 源码映射 | .map 文件，压缩后报错仍能定位到原始源码行号 | |
| Lint / Linter | /lɪnt/ | 代码检查 | ESLint、run lint、lint error（不符合规范的错误） |
| Format | 格式化 | Format Document、Prettier format | |
| Refactor | /ˌriːˈfæktər/ | 重构 | refactor this function、code refactoring |
| Deprecate | /ˈdeprəkeɪt/ | 废弃（但还能用） | deprecated API（不推荐用了，下一版可能删） |
| Legacy | /ˈleɡəsi/ | 遗留（老代码/老系统） | legacy system、legacy code（祖传屎山） |
| Hotfix | /ˈhɒtfɪks/ | 热修复 / 紧急补丁 | 生产出 bug，紧急发一个小版本修 |
| Rollback | 回滚 | 新版本炸了，rollback 回上一个版本 | |
| Downtime | /ˈdaʊntaɪm/ | 宕机时间 / 不可用时间 | service downtime、zero downtime deploy（不停机发布） |
| Uptime | /ˈʌptaɪm/ | 可用率 / 正常运行时间 | 99.9% uptime（全年宕机不超过 8.76 小时） |
二、前端高频词（HTML/CSS/JS/框架/工程化）
| 英文 | 发音 | 中文 | 说明 |
|---|---|---|---|
| Element | 元素 | DOM element、HTML element | |
| Attribute / Attr | 属性 | HTML attribute（id/class/data-xxx） | |
| Property / Prop | 属性（对象） | JS object property、Vue props（父传子） | |
| Event | 事件 | click event、event handler、event listener | |
| Event Bubbling | /ˈbʌblɪŋ/ | 事件冒泡 | 子元素事件一层层传到父元素 |
| Event Delegation | /ˌdelɪˈɡeɪʃn/ | 事件委托 | 把监听绑在父元素上，利用冒泡处理子元素 |
| Scope | /ˈleksɪkl/ | 作用域 | global scope、local scope、lexical scope（词法作用域） |
| Closure | /ˈkloʊʒər/ | 闭包 | 函数套函数，内层能访问外层变量 |
| Hoisting | /ˈhɔɪstɪŋ/ | 变量提升 | var 声明会提升到函数顶部 |
| Prototype | /ˈproʊtətaɪp/ | 原型 | JS 原型链、prototype chain |
| Callback | /ˈkɔːlbæk/ | 回调 | callback function、callback hell（回调地狱） |
| Promise | 承诺对象 | resolve / reject / then / catch / Promise.all | |
| Async / Await | 异步 / 等待 | async function、await promise | |
| Mutable / Immutable | /ˈmjuːtəbl/ | 可变 / 不可变 | 数组 push 是 mutable；展开运算符返回新数组是 immutable |
| Shallow Copy / Deep Copy | 浅拷贝 / 深拷贝 | 赋值/Object.assign 浅；JSON.parse(JSON.stringify) 深（但不能拷贝函数） | |
| Serialize / Deserialize | /ˈsɪriəlaɪz/ | 序列化 / 反序列化 | 对象 → JSON 字符串（序列化）；反过来（反序列化） |
| Parse | 解析 | JSON.parse、parseInt、parse URL query | |
| Stringify | 转字符串 | JSON.stringify | |
| Render | 渲染 | render a component、re-render（重新渲染） | |
| Mount / Unmount | 挂载 / 卸载 | componentDidMount、onMounted（组件插入 DOM） | |
| Lifecycle | 生命周期 | Vue/React 组件生命周期钩子（created/mounted/updated/destroyed） | |
| Hook | 钩子 | React Hooks（useState/useEffect）、Vue 3 Composition API 也叫 hooks | |
| State | 状态 | local state、global state（Vuex/Pinia/Redux） | |
| Store | 状态仓库 | Vuex store、Pinia store | |
| Mutation | /mjuːˈteɪʃn/ | 变更 / 突变 | Vuex 里改 state 的唯一入口叫 mutations |
| Action | 动作 | Vuex/Redux 里的 action（可以异步，最后 commit mutation） | |
| Getter | /ˈɡetər/ | 计算属性（Vuex） | 同 computed，但在 store 里用 |
| Computed | /kəmˈpjuːtɪd/ | 计算属性 | 依赖其他响应式数据自动计算，带缓存 |
| Watch / Watcher | 监听 | watch 某个值变化，触发回调 | |
| Directive | /dɪˈrektɪv/ | 指令 | v-if / v-for / v-model / v-bind / @click |
| Slot | /slɒt/ | 插槽 | Vue slot、default slot、named slot、scoped slot |
| Component | 组件 | child component、parent component、reusable component | |
| Conditional Rendering | /kənˈdɪʃnəl/ | 条件渲染 | v-if 真渲染假销毁、v-show 真渲染假隐藏 |
| List Rendering | 列表渲染 | v-for，必须配 :key | |
| Two-way Binding | 双向绑定 | v-model = 表单 value + input 事件组合 | |
| Virtual DOM | /ˈvɜːrtʃuəl/ | 虚拟 DOM | 用 JS 对象模拟 DOM，diff 后最小化更新真实 DOM |
| DOM Diff | DOM 对比算法 | 新旧虚拟 DOM 对比，找最少改动 | |
| Re-render | 重新渲染 | state 变了组件就 re-render，注意性能优化 | |
| Memo / Memoize | /ˈmemoʊ/ | 记忆化（结果缓存） | React.memo、useMemo、useCallback，减少不必要渲染 |
| Tree Shaking | /triː ˈʃeɪkɪŋ/ | 摇树（死代码剔除） | 打包时把没用到的 export 自动删掉（依赖 ESM import/export） |
| Code Splitting | 代码分割 | 动态 import()，按路由/模块分包，首屏不加载全部 | |
| Lazy Load | 懒加载 | 图片 lazy-load、路由懒加载（到了才加载） | |
| Preload / Prefetch | 预加载 / 预获取 | 下一页面会用到的资源，先悄悄下载 | |
| Polyfill | /ˈpɒliːfɪl/ | 兼容补丁 | 老浏览器没有 Promise，给它打个 polyfill 就能用 |
| Transpile | /trænˈspaɪl/ | 转译（语法降级） | Babel 把 ES6+ 转成 ES5，TS 转 JS |
| Responsive | /rɪˈspɒnsɪv/ | 响应式（布局） | 媒体查询，一套代码适配 PC/平板/手机 |
| Adaptive | 自适应（布局） | 不同设备写不同套页面，和 responsive 区别开 | |
| Breakpoint | /ˈbreɪkpoʊnt/ | 断点 | 响应式断点（768px、992px、1200px） |
| Flexbox | /ˈfleksbɒks/ | 弹性布局 | display: flex；别和 flex（弹性的）混说 |
| Grid | 网格布局 | display: grid，二维布局神器 | |
| Pseudo-class | /ˈsuːdoʊ/ | 伪类 | :hover、:active、:focus、:nth-child |
| Pseudo-element | 伪元素 | ::before、::after，必须配 content 才生效 | |
| Specificity | /ˌspeʃəˈfɪsəti/ | 选择器优先级 | !important > 行内 style > id > class > 标签 |
| Inline / Block / Inline-block | 行内 / 块 / 行内块 | 三种 display：span(a/img) 行内、div(p) 块级 | |
| Margin Collapse | /ˈmɑːrdʒɪn kəˈlæps/ | 外边距重叠 | 上下两个块元素 margin 取最大的，不是加 |
| Box Model | /bɒks ˈmɒdl/ | 盒模型 | content-box（默认）vs border-box（推荐，padding/border 算在 width 里） |
| Viewport | /ˈvjuːpɔːrt/ | 视口 | 移动端 ，vw/vh 单位基准 |