支付宝开源移动端流式 Markdown 渲染引擎 FluidMarkdown

在大模型驱动的智能应用时代,AI 生成内容的规模与复杂度持续攀升。无论是对话助手、智能体服务,还是客服系统与知识问答,Markdown 已成为连接 AI 与用户界面的关键桥梁,让信息表达更清晰、更结构化。

然而,在移动端原生开发中,想要实现高效、流畅的实时 Markdown 渲染并同时兼顾流式增量输出与灵活样式定制,仍是一项棘手的技术挑战。

为此,支付宝终端技术团队推出并开源了 FluidMarkdown ------ 一款专为智能化业务场景打造的移动端原生 Markdown 渲染库。它能够轻松应对大模型的逐字输出,并为开发者提供高度可定制的交互与视觉表现,助力构建新一代智能应用体验。

  • GitHub 地址:github.com/antgroup/Fl...

  • 开源协议:Apache-2.0

  • 支持平台:iOS / Android(HarmonyOS 平台开发中)

为什么选择 FluidMarkdown?

市面上主流的 Markdown 解析方案多集中于 Web 端(如 marked.js、remark),而在移动端原生环境中存在明显不足:

  • 语法覆盖有限:多数库仅支持基础语法,缺乏对复杂嵌套结构或 HTML 扩展的支持;

  • 缺乏流式渲染:无法适配大模型"逐字生成"的特性;

  • 定制能力不足:样式扩展与交互事件(点击、曝光、状态回调等)支持薄弱。

FluidMarkdown 正是为填补这一空白而生。它能够将大模型实时返回的 Markdown 文本,以低延迟、高保真、可交互的方式渲染到原生组件,并支持动态内容追加与高度灵活的视觉定制。

目前,FluidMarkdown 已在蚂蚁集团多个高流量 AI 场景中稳定运行,兼容性、稳定性与扩展性均经过大规模验证。

✨ 核心特性一览

完整 Markdown 语法支持

基于 CommonMark 规范实现,覆盖绝大多数常用语法:

  • 标题、段落、引用、分隔线

  • 有序/无序列表

  • 表格、代码块(支持语言标识)

  • 数学公式(LaTeX)、行内代码

  • 超链接、图片、脚注等

混合 HTML 标签支持

除标准 Markdown 外,还支持部分 HTML 标签渲染,满足富文本扩展需求:

xml 复制代码
<s>, <sup>, <sub>, <mark>, <a>, <span>, <cite>, <del>, <font>, <u>, <img>

双渲染模式:流式 + 全量

  • 流式渲染:边接收边渲染,完美适配大模型的 token 流式输出;

  • 全量渲染:一次性完整渲染,适配传统场景。

高度可定制化的样式系统

通过结构化 Model 暴露渲染节点,开发者可自由控制:

  • 列表前缀符号(数字、字母、自定义 Icon)

  • 字体、颜色、间距等样式属性

  • 自定义标签处理器(见下文扩展能力)

丰富的运行时回调

  • 可点击元素(如链接、图片)的事件监听

  • 内容曝光区域监测(可用于埋点)

  • 打印状态变更通知(开始、进行中、结束)

扩展标签支持(AMHTMLTransformer)

通过 AMHTMLTransformer 支持自定义标签与样式扩展,例如:

  • <icon>

  • <iconlink>

  • 以及部分标准 HTML 标签的样式增强

  • 更多内容可参看 AMHTMLTransformer 类

🤝 欢迎使用并参与 FluidMarkdown

FluidMarkdown 致力于为智能时代提供流畅、灵活的移动端原生 Markdown 渲染体验。FluidMarkdown 的开源愿景是:"共创 AI 基建,贡献点滴变化。"

我们相信,优秀的基础设施源于社区的共同打磨。

无论你是移动端开发者、Markdown 爱好者,还是企业团队,都欢迎参与 FluidMarkdown:

  • 移动端开发者:可以在项目中集成 FluidMarkdown 并反馈使用体验与问题;

  • Markdown 爱好者:可以参与功能扩展、样式优化或贡献代码;

  • 企业团队:可以在实际项目中落地使用,并提出改进建议。

你的参与,都是推动 FluidMarkdown 不断成长的重要力量。

  • 🌟 如果你在体验后如果觉得有价值,请顺手在 GitHub 点一个 Star 支持项目;

  • 💬 如果有任何问题或建议,欢迎提 Issue 或直接联系 maintainer;

  • ✨ 也欢迎 Fork 与 PR。

让我们携手,为下一代智能应用,打造更流畅、更强大的内容呈现方式!

🙏 致谢

FluidMarkdown 的诞生离不开众多开源项目与工程师的努力。我们在此特别致敬以下优秀项目:

同时,也感谢所有曾经参与蚂蚁内部 Markdown 组件建设与贡献的工程师们。

GitHub:github.com/antgroup/Fl...

相关推荐
神码编程5 天前
【Unity】HTModuleManager(三)Markdown语法的Unity编辑器方言
unity·markdown·模块管理器
哆啦A梦任意门9 天前
Vditor:markdown组件的使用
markdown
飞哥数智坊11 天前
分享一个 VS Code 插件:一键把 Markdown 网络图片存本地
markdown·visual studio code
Layer12 天前
CommonMark 解析策略与 cmark 工程核心代码解析
架构·markdown·设计
Source.Liu16 天前
【pulldown-cmark】 初学者指南
rust·markdown·pulldown-cmark
Damon小智18 天前
仓颉 Markdown 解析库在 HarmonyOS 应用中的实践
华为·typescript·harmonyos·markdown·三方库
Source.Liu19 天前
【BuildFlow & 筑流】品牌命名与项目定位说明
c++·qt·rust·markdown·librecad
siaikin22 天前
基于 Astro Starlight 的多框架文档
前端·vue.js·markdown
深海的鲸同学 luvi23 天前
【HarmonyOS】原生 Markdown 渲染解决方案 —— @luvi/lv-markdown-in
华为·harmonyos·markdown·原生渲染
secondyoung1 个月前
Markdown转换为Word:Pandoc模板使用指南
开发语言·经验分享·笔记·c#·编辑器·word·markdown