飞猪搭建体系介绍
可视化页面搭建技术在业界已相当成熟，几乎每个前端团队都会建设一套页面搭建系统，它显著提升研发效率与交付速度，已成为业务快速迭代与规模化生产的关键基础能力。飞猪移动端页面搭建最早诞生于营销大促场景，不同于常规的业务开发，营销大促业务具有以下特点：
迭代速度快：飞猪大促项目频次高且节奏紧凑，传统瀑布式研发模式难以适配业务快速迭代诉求。需沉淀一套面向活动场景的低代码平台，将页面公共能力和通用组件进行标准化、平台化，以降低重复开发与跨团队协作成本，支撑快速迭代与高频发布，在有限周期内兼顾交付效率与稳定性；
页面数量多：同期活动通常涵盖多个会场、频道、主题页及域外落地页等，上百个活动页面并行推进，且页面结构差异较大，高频、紧急的营销节奏叠加海量页面需求，使研发交付压力显著增加；
页面变阵频繁：一场完整的大促活动通常要经历「预热、预售、现货」等多个阶段，不同阶段的核心目标与主推商品 / 权益会递进变化，运营工作人员需要实时盯盘，根据流量、转化与库存等数据频繁调整页面内容与商品坑位布局且要求快速生效；
基于上述特性，飞猪移动端页面搭建体系应运而生，我们围绕可视化搭建、数据配置与动态渲染三大核心能力，打造了一套面向高频迭代与规模化交付的页面搭建体系。该体系从初代寄生于阿里集团搭建平台下的一个服务站点起步，先后经历了数据投放服务自建、平台能力自建、搭建服务与渲染底座自研。最终形成了当前将数据投放与页面搭建深度融合的一体化“搭投”体系，能够灵活支撑营销大促、日常频道、互动玩法、机酒汽等行业场景、商业化以及小程序等多场景业务需求。
飞猪搭建体系遵循 PMT 模型规范，核心概念包括：
Page（页面）：用户可访问的完整页面载体，由页面容器聚合多个业务模块完成运行时渲染，页面容器提供通用基础能力，包括：模板引擎渲染、协议数据的转换与分发、组件依赖与运行时注入、以及埋点与日志等公共服务；
Module（模块）：可复用的业务组件单元，封装组件的展示与业务逻辑并定义数据绑定规则，支持独立配置、按需组合编排，快速拼装成不同页面结构；
Tag（资源位）：模块内用于承载内容投放的最小单元，用来挂载与管理投放数据，一对多关联具体数据投放配置，并支持个性化规则定投；
飞猪搭建平台
现状与可优化空间
从寄生站点到自研体系的全面回迁，标志着飞猪搭建体系逐渐成熟，但是依赖传统人工选搭投的模式没有得到本质化的改变。下一阶段的重点，是在既有能力之上进一步释放效率红利，围绕“搭建自动化、配置智能化、保障体系化”持续优化：
运营侧提效：页面搭建链路仍有较大提效潜力，当前运营在模块选择、配置理解、跨平台联动配置上投入时间较多，且在日常使用中对咨询支持的需求仍然较旺。与此同时，运营团队更新节奏快，新人从熟悉到独立产出仍需要一定学习成本，存在进一步降低门槛、增强引导与工具化的空间；
设计侧降本增效：页面交付对设计资源的依赖仍然较重，尤其在大促等峰值场景，设计需求集中、节奏紧，容易成为影响整体交付效率的关键路径。日常场景采用计件和众包模式也带来一定的成本与协同开销，因此在设计素材智能生成等方面有进一步优化空间；
产研侧提效：
答疑提效：尽管已有答疑平台与知识库沉淀，但是在自主排查方面仍可继续增强，高频场景可进一步沉淀标准化诊断与一键解决方案，减少人工介入；
技术保障提效：大促会场通常需要多轮预演，上线后也需要持续巡检以应对业务调整带来的体验波动。随着平台迭代和营销活动频次提升，可通过自动化预检和巡检等方案持续降人工保障投入；
研发提效：搭建模块遵循特定规范与约束，新人从上手开发到独立交付仍需一定学习成本；同时由于容器和渲染等核心链路的黑盒特性，仍需平台负责人员提供一定协同支持与保障。可引入 AI Coding 辅助研发，并完善 AI 自助诊断与排障工具，提升代码研发与问题排查效率，降低对平台协同支持的依赖；
AI 化升级的目标
如今正是 AI 蓬勃发展的时代，问答推理、物料生产、流程编排等方案已经成熟，当下的命题应当是思考搭建 + AI 如何深度结合，打造智能化搭建系统，从人工运营向 AI 辅助运营转型，最终实现无人值守自动化运营。为解决选搭投当前的问题正式启动 AI 智能搭投升级专项：深度融合图文素材生产系统、大模型调度编排等能力，将 AI 模式注入招商选品、页面搭建、数据投放等核心系统，构建从需求理解 → 智能编排 → 自动执行的搭投新范式，为未来全域智能运营奠定技术基础。
提升运营配置效率：打通“招选搭投”体系 AI 基础能力，通过推荐模板页面、智能搭建页面、智能助理运维等能力辅助业务快速完成页面搭投，覆盖飞猪页面搭建全场景、提升运营配置效率、减少页面配置时间；
减少设计投入成本：全面推广 AI 文生图和创意合图能力，实现计件众包模式向业务自助产图转型，减少设计费用实现流程提效；
减少人工答疑成本：AI 赋能答疑场景，提升答疑助手拦截率，常见配置问题自动定位并引导解决，缩短问题解决耗时；
提升模块研发效率：模块研发全面拥抱 AI 模式，完善搭建 IDE Rules + MCP 生态，探索 D2C 在搭建模块开发应用场景，提升模块开发效率；
产品结构设计
智能选搭投体系 = AI 搭建 + AI 投放 + AI 素材 + AI 助理 + AI 答疑 + AI Coding
产品结构
技术实现细节
智能搭建
模板检索
为了保证 AI 生产的页面尽可能贴合飞猪营销页面规范且保证转化效率，以及让运营人员有体感预期，我们采用模板预览的形式作为平台入口，基于用户描述推荐场景相似且业务效果较好的模板，用户可进行预览并确认后进入下一步生产流程。此外我们对页面模板进行了分类，不同的页面类型会走到不同的 Agent 完成生产。
模板预览
那么这么多页面模板从哪里来呢，总不能人工维护吧？答案是基于历史页面作为模板即可，毕竟运营人工搭的页面一定是符合预期效果的。通过跑定时任务批量对历史页面进行回溯，再交给多模态 LLM 分析页面内容打标，作为检索关键词进行向量化并落库，检索时进行相似度计算排序即可，实现细节如下：
页面回溯：处理埋点日志找到页面 UV 最大的日期，基于该日期进行页面结构和投放数据 mock 穿越处理，并忽略页面下线重定向逻辑，即可回溯到该页面历史线上投放效果；
页面快照：基于无头浏览器对页面进行截图，生成页面截图快照；
内容打标：基于多模态 LLM 进行页面内容分析，生成页面内容维度标识，包括：页面介绍、关键词、行业标、主题标、质量评分、效率评分等，作为相似度计算的依据；
向量持久化：基于 multimodal-embedding-v1 等多模态向量模型将快照截图和内容标识转换成浮点向量，存到关系型数据库即可（如果数据量较大推荐使用向量数据库）；
检索召回：实时检索时先进行简单的 SQL 检索过滤，再将用户关键词进行向量化，与数据库中的向量字段进行余弦相似度计算，最后排序返回即可；
向量检索链路
页面生产
在页面生成链路，我们梳理了飞猪现存搭建页面类型，大致可分为“搭建页”、“频道页”、“图文页”、“文本页”四类，不同页面类型有着各自的应用场景，需要针对性设计不同的技术方案：
最终生产的页面效果如下，完全达到线上可投放标准：
搭建页
传统搭建页主要通过各行业通用模块搭建而成，不同搭建模块配置项各异且繁琐，新人理解学习成本非常高，即便是运营老司机走完配置流程也需要花不少时间，另外在配置过程中还需要填写大量图片素材依赖设计团队产图，页面搭建过程并不丝滑，一整套页面搭建下来往往需要花费大半天甚至几天时间。
为此我们设计了智能搭建系统，基于用户选择的页面模板复制页面和模块，LLM 推理用户需求总结归纳为页面搭建方案，批量调用智能投放链路（详见后文）完成模块配置，再打通后续排期发布和页面发布工程链路。整套流程只需要 3 min 即可完成，用户描述需求后全程无感，并且支持退出页面后台异步生产。
搭建页面生产效果
整体走大模型编排链路，链路如下：
搭建页生产链路
各流程节点实现细节如下：
图文页
传统搭建模式难以有效支持图文页面场景，难点在于图文页偏设计化、页面结构较复杂，一直以来我们都依赖设计出视觉稿再切图投放，该模式设计计件费用昂贵并且流程较长，对于短平快的营销场景来说是属于历史糟粕亟需革命。我们尝试了以下方案，结果总是差强人意：
我们总是在讨论 AI Coding 如何对程序员提效，那么能否直接绕过 “中间商赚差价”（拿起剪刀剪自己辫子），让运营工作人员直接基于 AI 生产页面呢？答案是可以的，抛开复杂的页面交互逻辑，如果仅是产出静态图文页面，完全可行。
我们设计了一套 Agent 模拟 “前端页面开发” 流程，由 LLM 担任产品、PM、设计、开发等多角色，协同完成图文页面开发任务，最终产物为页面 HTML 代码。再将 HTML 代码渲染至左侧面板提供预览能力，支持文本、图片等 DOM 元素可视化编辑以及选中元素后 AI 微调等能力供运营人员二次调整。页面调整完成后会按页面片段进行图层切分，基于 html2canvas 库将 HTML 片段代码转换成 PNG 图片，导入图片模块并借助 LLM 完成自动圈选热区，最终生成可点击图文页面，或者直接 HTML 代码注入模块实时渲染。
图文页生产效果
整体采用 Manager–Worker 架构设计智能体，拆分分析器、调度器、设计师、工程师等多个角色协同完成长图文生产任务，单 Agent 内部实现完整的 ReAct 范式确保输出最优，使用任务队列模式存储执行进程和上下文，由 AI 自主完成监督调度。在设计 Agent 时需要严格约定出入参数据格式以便调度器准确调度执行，另外还需要设计纠错机制和重试机制保障 Agent 节点在意外抖动时整体链路能够稳定运行。图片页生产链路
核心 Agent 实现细节如下：
智能投放
飞猪搭建体系遵循 PMT 规范，其中资源位数据投放也是搭建链路中重要的一环，我们自建了数据投放系统，支持静态数据源（模块配置）、标准数据源（商品宝贝、酒店日历房）、插件数据源（服务端接口）三类数据类型，涵盖了几乎所有场景的数据内容投放。在搭建 AI 化升级过程中我们对数据投放链路同步进行了升级，衍生出了智能投放链路。智能投放目前支持了图片素材、模块配置、商品选品、二方平台四类场景一句话快速投放，并且支持全类目定投策略智能关联能力，如：时间周期、人群、设备等。我们还对智能投放原子化能力进行封装以支持页面级批量调用，通过 LLM 分析页面主题归纳页面搭建方案，各模块基于搭建方案自主生产投放数据。
智能投放技术链路如下图，首先 LLM 会根据用户描述、页面和模块信息进行推理，生成符合页面主题的模块推荐配置，引导用户快速选择。用户进一步描述后，LLM 针对不同物料类型生成所需的内容素材，包括：配置项（JSON）、文案、图片等，并对素材内容整合转换成模块配置入参，若语义识别到用户有定投诉求会自动进行配置，最后调工程链路完成排期发布和钉钉消息通知。
智能投放链路
智能投放各节点详细方案和效果如下：
智能助理
在页面搭建过程中，运营人员除了搭建模块和数据投放外，通常还需要配置页面容器、插件，以及后续投放过程中的渠道加参和转码转链等操作。这类配置内容比较分散，甚至跨多个平台，对于新人运营人员有一定学习过程。因此我们结合 AI 能力推出了「智能助理」，涵盖：页面修改、转码转链、热点分析等多种能力，支持语义识别用户的诉求自动调用相应的工具，辅助用户提高运营效率。
技术链路上比较简单，通过 LLM 理解用户的操作意图，转换成工具约定的出入参并调用底层平台能力完成对应的操作，功能实现细节如下：
智能素材
此外我们还提供了原子化素材创意生成能力，帮助有匠心的运营人员快速微调和优化页面素材内容：
AI 答疑
飞猪搭建直面一线运营人员，我们没有专业的技术支持人员，答疑工作只能由产研人员“兼职”。每天面对大量的答疑咨询工单，让本就繁忙的研发工作雪上加霜。在 LLM 普及后我们也是第一时间接入答疑场景，提供平台和群答疑两种交互模式，日常常见问题全部交由 AI 处理，技术人员只需处理疑难杂症即可。将答疑工作量减至原来的 1/6，拦截率达到 91.4%。
AI 答疑技术方案比较简单，纯调 LLM 没什么好说的，核心需要丰富的知识库来提高答疑准确率。我们扒了近几年来飞猪搭建相关的技术 & 产品文档，根据常见问题进行分类，修订为搭投提示知识库。有了知识库还需要对 RAG 进行优化，主要通过文档分段打标实现，我们通过三方接口召回了集团答疑工具近年来所有人工答疑记录，作为语料支持对现有知识库进行打标，文档缺失部分将该 Case 作为 FAQ 进行补充。基于存量知识库答疑总是具有局限性，随着飞猪搭建体系不断地迭代发展，所以还需要让 AI 自我学习最新知识，我们将 AI 对话和人工答疑对话落库，跑定时任务召回对话并进行向量化落库。后续实时检索时历史对话也会作为知识库的一部分。
AI 答疑 RAG 链路
AI Coding
搭建模块开发：
在 AI Coding 方面我们没有选择造 “重复且低质量的轮子”，而是在 Qoder、Cursor 等成熟 IDE 基础上，通过修订 Rules 方式增强 AI 编码能力。我们编写了 8 类搭建模块开发特殊规则，并接入飞猪代码仓库知识库、Ftech、Figma 等 MCP 服务实现组件库代码片段召回、PRD 理解、D2C 视觉稿转码等能力。有助于模块开发提效，对于新人入门非常友好，整体编码提效 80%+，实测模块功能实现和业务逻辑近乎完美只需要微调样式，规则目录如下：
schema 编写助手
飞猪搭建模块配置表单遵循类 JSON Schema 规范，我们开发了 Schema 编写助手，辅助开发快速生成表单配置，支持 mock 数据和 schema 配置互转，减少新人学习成本、提高模块开发效率、减少研发答疑成本。
schema 助手
总 结
通过对选品、搭建、投放、素材等平台全面整合，我们对飞猪搭建体系进行全面的 AI 化升级，面向运营、设计、产品、研发等全角色构建了一体化的智能搭建平台。在产品形态上，智能搭建体系已经形成智能创建、智能投放、智能素材、智能助理、AI 答疑、AI Coding 六大支柱，为未来全域智能运营奠定基础。
开发一套 AI 体系远比想象中困难，它不像写代码那样有明确、可复现的确定性结果，几乎每天都在对着“人工智障” 挠头。最棘手的问题之一就是大模型的幻觉：自始至终都在困扰着我们，哪怕只是一个很细微的偏差，在多轮任务的链式执行中也会被不断放大，最终产出就可能变得不可用。在不讨论训练 / 微调模型这类高阶手段的前提下，我认为提升 Agent 准确率无外乎以下几种手段：
架构设计：Agent 开发需要有 “把不确定性关进笼子” 的架构设计，实践中可以结合具体场景参考网上的经典设计案例，把任务拆解为可控步骤并引入观测、校验、重试、回滚等机制，将大模型的自由生成约束在可验证和纠偏的闭环中以降低幻觉；
工程实现：多数场景下，工程代码在执行性能与稳定性上更具优势，对于链路中规则清晰、可验证的环节，优先用工程代码实现，能有效降低不确定性；
Prompt 调优：Prompt 是一门学问，调好了能让大模型稳定地发挥能力，总结来说就是结构化、多约束、评估标准、分层书写。网上有许多教程和黑科技，不妨先快速学习一轮，实践中灵活尝试运用，磨刀不误砍柴工；
上下文管理：对于多 Agent 体系中，上下文管理尤为重要，一股脑往里塞必然导致 “上下文污染” 越聊越偏。因此需要设计合理的 memory 结构，为上下文标注来源和边界，只使用可信内容、临时内容及时销毁；
模型升级：终极大招，可能你调了半天发现还没换个模型见效快，那就等待 AI 科技的发展进步吧。但是别忘了，基建架构是不可逆的，设计好了就是锦上添花，设计烂了就是雪上加霜；
展望
下一阶段的关键在于把 AI 搭建从 “提效 Copilot” 升级为 “可控、可评估、可闭环的生产系统”，通过约束式架构、自动诊断调优等手段不断提升 AI 的自我思考能力并减少幻觉，推广到日常活动、频道运营、大促活动等方方面面，支撑飞猪更高频、更复杂、多场景的全域智能运营。以下是建设过程中的一些思考以及后续规划：
