网易云音乐低代码 + ChatGPT 实践方案与思考

随着大语言模型（LLM）不断涌现的各种能力，生成式 AI 的应用场景变得越来越广阔。诸如 ChatGPT 这类大语言模型在生成代码方面非常的高效，因此对于如何将 LLM 的能力与低代码产品进行结合，业界已经有了很多的讨论和实践，但都距离实际的生产场景有一定的距离。本文将会介绍的是，网易云音乐大前端团队是如何借助 LLM 的能力来扩展和增强低代码产品的研发体验的，本文所涉及的内容均已在内部生产环境中上线并得到应用。

LowCode Copilot 功能预览

Contents

LowCode Copilot 功能预览智能创建页面智能修改页面智能组件属性配置智能代码片段生成智能问答和编程助手构建思路与实现原理从编程语言到提示工程（Prompt Engineering）编程语言的平民化对未来的思考参考资料

首先，给大家快速地预览一下我们在网易云音乐内部的低代码平台中上线的 AI Copilot 功能，目前提供了包括智能创建页面、智能修改页面、智能属性配置、智能代码片段生成、智能问答和编程助手等多种能力，下面是具体的演示内容。

智能创建页面

在云音乐低代码平台 Tango Studio 中，我们集成了 LLM 的能力来加速前端应用的开发流程和体验，开发者可以借助于简单的自然语言描述的方式快速生成表单、表格、详情、仪表盘等页面，而无需记忆大量的组件配置和功能点，有效地提升了低代码平台的使用效率。

例如，在 AI 对话面板中，可以输入 “创建一个审批表单页面，字段包括审批人，审批时间，审批意见”，短暂的等待，就可以直接生成整个表单应用，用户只需要进行逻辑上的微调，即可完成整个前端应用的构建。

智能修改页面

如果生成的页面不是你想要的，也可以通过聊天面板通过自然语言输入的方式对页面内容进行微调，例如增删改表单或列表的字段，修改页面标题，自定义组件样式等等，为用户提供低成本高容错的交互体验。

例如，“增加一个是否同意的字段”。

智能组件属性配置

除了使用 AI 对话面板，用户还在在选中某个组件后快速唤起 AI 输入框，通过简单的自然语言描述方式对当前组件的配置进行微调，例如组件的样式，大小，状态等属性的设置。

例如，“背景色改为淡黄色”，“使用垂直布局” 等。

set config

form layout

智能代码片段生成

在云音乐低代码平台中，用户有很多地方可以直接编写代码而不是使用可视化 UI，因此我们将 LLM 生成代码的能力集成进来，帮助用户快捷的编写表达式代码，为开发者提供比可视化拖拽更高效的研发体验。

例如，“过滤掉返回值中 name 不是 alice 的数据”。

code generate

智能问答和编程助手

由于 B 端产品的特殊性，通常会有一定复杂度的流程和功能模块，用户需要阅读使用文档才能完全掌握系统的使用。借助 LLM 的能力，我们可以将软件文档分片后存储到向量数据库，并借助 LLM 来构建基于上下文的问答系统，为用户提供全新的问答体验。同样，我们将这种能力融入到系统的问答过程中，为用户提供比关键词搜索更良好的答疑体验。

Q&A

构建思路与实现原理

此前曾经分享过对于网易云音乐低代码体系的建设思考和实践，结合业务和团队的现状和痛点，团队构建了一套基于源码的低代码研发体系，支持开发者使用 LowCode 和 ProCode 双模式在线混合开发，并且支持两者的双向同步，为业务场景提供足够的灵活性，借此推动低代码研发方式在云音乐大前端场景的渐进式覆盖。

云音乐低代码平台实现的核心思路是：将源代码解析为 AST ，在 AST 的基础上进一步抽象和建立文件模型和节点模型，通过将视图的拖拽配置行为转为对 AST 的操纵和修改，进而将变化后的 AST 重新还原为源代码。具体如下图所示。

LowCodeEngine

以源码为核心的低代码平台构建方案为我们在内部大力推广低代码开发提供了很大的便利，因为在实际的使用过程中，大量的需求变化仍然依赖于开发者对组件和逻辑的自定义，传统的低代码方案对于这种需求变化的支持并不友好，而以源码为核心的低代码平台则可以很好的解决这个问题。

此外，以 GPT 为代表的这类大语言模型在文本生成方面具有非常高的效率，因此将其应用在代码生成方面具有非常高的准确性。结合我们在云音乐采用的源码驱动的低代码开发方案，我们很顺利的将 GPT 的能力集成到了云音乐低代码平台中。

tango-ai-flow

具体的原理如图所示，对于用户的输入指令，首先会被组装为标准化的 Prompt 模版，进而解析用户指令中的用户意图，借助于向量数据库进行近似度匹配，将关联的信息合并到 Prompt 中，然后借助预训练的 GPT 大模型推理生成代码，最后将 GPT 返回的代码合并到当前工程中，触发应用视图重新渲染。

通过构建基于源码的低代码开发能力，可以为一线业务开发同学提供全新的线上线下一体化混合开发流程。传统的实现方案线上与线下流程独立，不互通；资产独立，不共享；并且低代码应用出码流程也是单向不可回流的。结合于大语言模型的能力，我们进一步构建了云音乐的混合开发方案，支持使用同一份前端资产和代码库，支持用户通过低代码 IDE、ChatBot、本地 IDE 三种方式开发同一个前端工程。具体的效果如下图所示。

mixed flow

从编程语言到提示工程（Prompt Engineering）

在云音乐低代码平台中，我们将自然语言推理作为一个独立的底层服务。在用户输入指令后，会将用户的输入指令和当前工程的信息组装为一个标准化的 Prompt 模版，然后将 Prompt 模版发送给自然语言推理服务，并基于底层大语言模型服务推理生成代码，进而再将生成的代码合并到当前工程中。使用提示工程进行低代码编程的基本流程如下图所示。

借助提示工程实现低代码编程的基本流程示意图

可以说提示工程已经成为了一种新型的平民化编程语言，借助于大语言模型的能力，可以低成本的实现代码的生成。类似于 AutoGP, Self-INSTRUCT 这类产品，则是直接基于结构化的 Prompt 来驱动 GPT 实现自动任务调度。AutoGPT 使用 GPT-4 生成、优先排序和执行任务，使用插件进行互联网浏览和其他访问操作。它使用外部内存来跟踪自己正在做什么并提供上下文，这使得它能够评估自己的情况、生成新任务或自我纠正，并将新任务添加到队列中，然后对其进行优先排序，具体的流程如下图所示。

Auto GPT

编程语言的平民化

我认为，以 GPT 为代表的大模型服务必将改变未来所有产品的构建思路和用户使用方式，LLM 也将成为新一代的互联网基础设施。借助于生成式 AI 的能力，可以显著地改善低代码产品的可用性和易用性问题，并且让软件开发的过程更加简单且富有趣味性。

同时也不得不让我们重新思考低代码产品的设计与构建过程，因为 GPT 为代表的这类生成式 AI 在代码编写方面尤为擅长，它将显著的提升编程语言的平民化速度。相较于编程语言，自然语言具有更高的容错性，而传统的代码编程则非常依赖于精准地使用编程语法。在 ChatGPT 中，你甚至可以利用伪代码进行编程。

使用 ChatGPT 进行伪代码编程

对未来的思考

对于低代码产品而言，私有协议和复杂的 DSL 设计会导致系统的可扩展性变得越发艰难，且难以利用社区庞大的开源代码资产。而 GPT 这类大语言模型利用了数量庞大的开源数据集进行训练，在生成主流编程语言代码方面具比一般程序员更强的编程能力，如果能够将 LLM 的能力与低代码的能力相结合，将会极大地降低软件系统的开发成本。因此，系统的设计需要考虑主流的社区生态和方案，否则将很难具有持续性。因此，更加明智的选择是拥抱开源社区的主流生态，最大化地利用开源资产和公司内部资产的结合来提升产品的功能和体验。

此外，借助于大语言模型能力的能力，我们也需要重新思考软件交互界面的设计，自然语言界面将会成为新的人机交互的必备界面。对于低代码产品的构建而言，过度的可视化交互逻辑反而会增加系统的复杂度，诸如 Retool 这类低代码产品也在越来越强调逻辑表达的灵活性，某些情况下图形界面并不比少量的表达式代码更高效。对于产品构建而言，需要找准目标用户，为用户提供更加符合直觉和心智的产品。

最后，以 ChatGPT 为代表的生成式 AI 可以大大提高信息处理和决策的效率，将会对我们对工作和生活带来深刻的影响，身处其中，我们需要不断探索和应用这些新的变化。

参考资料

1. ChatGPT在代码生成方面的应用：

https://openai.com/blog/openai-codex

2. 基于结构化Prompt实现GPT自动任务调度：https://community.openai.com/t/dissecting-auto-gpts-prompt/163892

3. ChatGPT伪代码编程：

https://community.openai.com/t/prompts-as-psuedo-code-where-are-the-limits/223

– END –

大佬观点

Treelab-何浚炫 | 阿里-汪凤震 | 明道云-薛晨 | 上海斯歌-傅正斌

公众号后台回复【加群】

可受邀进入【无代码&低代码技术应用研讨群】

欢迎各位从业者/应用者/关注者加入

网易云音乐低代码 + ChatGPT 实践方案与思考