目前市面上的ai对话像chatgpt、kimi、文心一言等,都是通过逐行逐字这样一种打字机效果将答案呈现给用户,但是我找了很久,没有找到开源好用、性能稳定、可用于微信小程序的markdown文档打字机组件。
我看别人大都是使用微信小程序的markdown渲染库,比如towxml等,通过一点点的增加markdown文本的长度,让组件一次次重新全部渲染来达到打字机效果,但这样的坏处很明显,每打一个字就会把整个markdown文本重新parse以及渲染,已经渲染出来的旧文本被
重复解析和渲染
,越到后面随着文本内容的增多,在较短的时间内重复对大文本进行重新解析和渲染,造成性能越来越差,打数字越来越慢,直到手机发热爆炸
。
基于此,我通过魔改towxml的源码,通过一种全新的方式,实现
无论多长
的markdwon文档,都只需要解析和渲染一遍
,从始至终
保持稳定的打字速度
和较低的性能消耗
。
魔改towxml源码,在微信小程序上实现markdown文档的AI打字机效果,支持:
-
控制打字机效果的开启和关闭
-
自定义打字速度
-
指定标签跳过打字机效果(比如表格等,直接一次性全部显示,不需要再一个个打字)
运行项目:
-
使用vsode打开项目
-
pnpm install
-
pnpm run dev:mp-weixin
-
打开微信开发者工具,导入dist\dev\mp-weixin