摘要
携程酒店前端 BFF 层在架构迁移与效能提升时面临挑战，本文阐述应对方案，包括 BFF 模式对比、云函数平台助力、前端动态化能力规划等内容
一、BFF 相关概念与背景
1.1 BFF 模式的产生背景
随着互联网和移动设备的发展，用户对应用需求多样化，后端微服务化变革中后端开发人员面临诸多问题，如无法专注于领域模型抽象、难以适应不同 UI 差异等。BFF 模式作为“面向前端的后端服务”被提出，它隔离了领域服务层和前端 UI 层，改变了开发人员的角色分工，使得后端专注于领域服务，BFF 开发人员（可能是前端兼任）与前端紧密合作提供合适的接口和数据结构。
1.2 两种 BFF 模式对比
一码一端
这一模式针对特定客户端提供单体 BFF 应用，如在 Ctrip 小程序端使用过。它能充分控制端差异，独立开发部署，具有快速部署和独立迭代的优点，适合小团队运维和快速上线。但也存在问题，会形成单体巨型应用，架构臃肿，且针对同一产品需求，各端的 BFF 应用内部会重复实现相似视图控制逻辑，不利于提高人效。
// 假设一码一端模式下的 BFF 应用代码结构示例
const bffOneCodeOneEnd = {
// 包含大量功能逻辑的单体应用结构
service: {
list: function() { /*... */ },
detail: function() { /*... */ },
fill: function() { /*... */ }
}
};
一码多端
该模式将预定主流程划分为关键阶段，不同 BFF 提供服务且一个 BFF 能服务多端并处理端的差异性。这样避免了重复开发，提升了研发生产效率，按页面流程维度进行微服务划分使得架构更清晰，迭代更灵活。实践结果表明这种模式更符合微服务职责划分原则，更有利于提高研发人效，当前酒店 BFF 层实践方向主要采用此模式。
二、基于 Nest 的多端架构
2.1 NestJS 框架优势
选择 NestJS 作为酒店 BFF 基础框架进行二次开发。NestJS 是构建 NodeJs 服务器端应用的框架，具有以下优势：
- 强大的模块化和可扩展性：代码组织和维护方便，有插件系统扩展功能。
- 内置的依赖注入容器：解耦服务和控制器，提高代码可测试性。
// NestJS 中依赖注入示例
import { Injectable, Inject } from '@nestjs/common';
@Injectable()
class MyService {
constructor(@Inject('Dependency') private dependency) { }
}
- TypeScript 的支持：可利用其静态类型检查和 ECMAScript 特性，也能用纯 JavaScript。
- 装饰器和元数据反射：使代码易于理解维护，自动处理常见模式。
- 支持微服务：有完整微服务解决方案。
- 测试工具：方便单元测试和端到端测试。
- 与其他库的集成：能轻松与流行库和工具集成。
2.2 基于 Nest 的 BFF 服务框架
在 Nest 框架的 IOC 能力基础上构建了专用于“一码多端”的 BFF 服务框架，它有以下作用：
- 提供标准开发模板，使多端处理逻辑开发标准化。
- 帮助开发者提高代码可维护性，如接口编写时的流程拆分和数据组件模块化。
- 促使开发者考虑处理一致性与差异性。
三、云函数平台
3.1 函数能力
轻量化运行时
- 云函数的基础镜像、业务代码、发布运维方面体现轻量化。基础镜像相比传统应用更轻，最新迭代的函数镜像仅包含微型系统、js 运行时、函数运行时，镜像大小减少 59%，利于快速拉起函数镜像和实例。
- 云函数代码结构简化，只需在定义 json 中定义函数入口，内置运行时处理请求和响应。
中间件能力
- 运行时集成 Tripcore 核心中间件集，自动启用部分基础能力，具有自动接入、无需安装常用组件 SDK、减少项目安装和构建时间、保障核心功能稳定性等优势。
- 函数中间件机制可将传统 Web 应用快速接入云函数，使用@ctrip/serverless - app 模块可部署多种 Web 框架应用。
其他函数能力
- 触发器：云函数通过触发器供外部调用，有函数 URL 可直接测试，还有多种类型触发器满足不同业务场景。
- 层管理：将不常变更的依赖库打包成层，减少部署镜像大小，加快部署速度，平台提供多种层并给出相关解决方案。
- 弹性扩缩：支持快速弹性伸缩，基于 RPS 和并发度指标进行扩缩，响应时间最快达秒级，可最小缩容到零，节省资源。
- 版本和流量切换：采用蓝绿部署提升系统可用性，支持快速更改堡垒流量指向、灰度发布、多集群部署等。
- 微型实例：实例规格最小可达 0.125C 和 128MB 内存，鼓励精细化资源管理与快速弹性能力结合。
- 函数场景：提供丰富函数场景和代码模板，有基础场景和业务 BU 定制化场景，基于 NestJS 的多端 BFF 框架被标准化为云函数应用模板。
3.2 研发流程和函数生态
迭代管理
- 研发流程可视化：以流水线方式展示开发流程节点。
- 详细的开发引导：开发过程中明确进度，遇到发布卡点有指引。
- 更专一的开发体验：系统接管部分操作，让开发者专注研发。
运维监控和故障诊断
- 监控面板：包含系统指标、Node.js 运行时指标，还集成 Node.js Astro 监控面板，提供多种监控能力，如实时监测 js 应用运行情况、定位依赖和代码变更问题、性能分析、调试等。
- Docker 化本地开发：由于 Node.js 函数内置运行时和中间件，本地只能单元测试业务逻辑，Mars 工具利用 Docker 容器能力模拟函数实例真实运行情况，辅助本地开发调试。
四、前端动态化能力
在 BFF 单体应用多端框架能力基础上，设计了动态业务网关。多端框架处理应用内“接口内逻辑差异”，动态网关层处理“接口间组合差异”，支持跨应用接口组装裁剪、白名单及灰度发布、场景动态能力等。“多端模式” + “动态网关”组合架构模式在应用内和应用间两个层级处理多端视图控制逻辑差异。例如在携程酒店某一级页面技改项目中采用此架构方案，实现多端功能模块收口落地 BFF 层，提高研发能效。
五、One More Thing
“一码一端”到“一码多端”的前端能效变革背景下的 BFF 整体解决方案（应用内多端 + 动态网关 + 云函数能力）除了支持 BFF 合并，还能提供强大的 UI 动态化能力，结合正在研发的跨端组件库，可支持多种用户场景，实现组件跨场景和跨端复用。