面向前端与全栈工程团队的术语与释义速查

Posted On 2025-11-15

缩写与技术术语清单与释义

一 核心模式与架构

• UI：用户界面（User Interface），指用户与系统交互的可视化部分，涵盖布局、组件、交互流程与可访问性。
• 前后端分离：将前端（页面渲染、交互逻辑）与后端（业务逻辑、数据存储）拆分为独立工程与部署单元，通过接口契约协作，提高并行开发与多端复用能力。
• 服务端渲染 SSR：在服务器将页面组件渲染为完整 HTML​ 返回，浏览器直接展示；常配合水合 Hydration在客户端“激活”为可交互 SPA，以兼顾首屏性能与SEO。
• CSR：客户端渲染（Client-Side Rendering），后端提供JSON API，前端在浏览器用 JavaScript​ 完成页面渲染与路由跳转，交互流畅但首屏依赖 JS 下载与执行。
• Node 中间层：在浏览器与后端之间引入Node.js层，承担路由转发、接口聚合、鉴权、日志等职责，为前端提供统一入口与编排能力。
• BFF：Backend For Frontend（面向前端的后端），为特定前端场景/端定制聚合、裁剪与编排后端服务，屏蔽后端复杂度，提升前端交付效率与性能。
• 同构 SSR：同一套代码在服务端与客户端均可运行（同构 JavaScript），常见形态是服务端渲染首屏、客户端接管交互（亦称“同构应用”）。

二 技术栈与工具

• 模板引擎：服务端模板工具，如 JSP（Java Server Pages）、Thymeleaf（Java）、Django Template（Python）、服务端 PHP​ 模板，用于在服务端拼接HTML​ 并返回。
• 前端框架：React / Vue / Angular，用于构建交互式前端应用；在 SSR/同构场景下配合框架的 SSR 方案使用。
• SSR 框架：Next.js（React 生态）、Nuxt.js（Vue 生态），提供路由、数据预取、代码分割、服务端渲染、静态导出等开箱能力。
• API 风格与协议：REST（表述性状态转移）、GraphQL（查询语言与运行时），用于前后端数据交互与契约化。
• 数据格式：JSON（JavaScript Object Notation），前后端数据交换的通用轻量格式。
• 静态资源与交付：Nginx（Web 服务器/反向代理/静态托管）、CDN（内容分发网络）用于加速静态资源与边缘分发。
• 微前端：将前端应用拆分为多个独立子应用，按域聚合，提升团队自治与复用；可与 SSR/BFF 组合使用。
• 工程化与质量保障：OpenAPI/Swagger（接口规范与文档）、契约测试（Consumer-Driven Contracts）、CI/CD（持续集成/交付）、代码规范与组件库。
• 云原生与 Serverless：云原生（容器化、编排、DevOps、可观测）、Serverless（函数计算/托管平台）用于弹性伸缩与降低BFF/SSR运维复杂度。
• 性能指标：LCP（最大内容绘制）、CLS（累积布局偏移）、TTFB（首字节时间）、FP/FCP（首次绘制/首次内容绘制），用于评估加载与渲染体验。

三 指标与运维概念

• SEO：搜索引擎优化（Search Engine Optimization），提升网页在搜索引擎收录与排名中的表现；SSR/同构更利于抓取与索引。
• 首屏性能：用户首次看到有效内容的速度与稳定性，受HTML 下载、JS 执行、资源加载、水合等环节影响；常用指标为LCP/CLS/TTFB/FP/FCP。
• 水合 Hydration：客户端以服务端渲染的HTML 为起点，绑定事件与状态，使页面从静态变为可交互的过程；需保证服务端与客户端状态一致以避免“水合不匹配”。
• 容量与容灾：系统在峰值下的承载能力与故障恢复能力，涉及水平扩展、自动扩缩容、熔断限流、多可用区部署等。
• 监控与告警：对业务指标、接口时延/成功率、前端性能指标、错误日志进行采集与可视化，并设置阈值告警以保障可用性。