项目介绍
之前开发了一个使用SVG元素做海报的服务。
大致业务逻辑就是用户上传图片作为素材，以及添加一些艺术文字作为素材；
支持各素材的2D变换，最后整体导出一张图片的项目；
目前市面上做的最好的竞品是稿定设计；
效果参考：
转换过程
- 使用jQuery获取SVG DOM内容
- 传递SVG内容和各素材的文字信息到后端
- 后端Java使用phantomjs封装的库来转换SVG为图片
方案缺陷
- phantomjs内核较为落后，导致用户在chrome预览和实际渲染不一致
- 耗时长，每次转换图片都要经历：打开chrome实例、打开tab页、转换图片、关闭浏览器的过程
- 后端对phantomjs了解很少，出问题只能喊前端看
- 第三方库没有开源，没法后续扩展，也没办法修复上述问题
优化方案
- puppeteer刚出来的时候简单用过，这个包对chromium版本的跟进很及时，考虑用这个来重构后端部分；
- 新的方案主要解决了渲染效果不一致，以及渲染慢的问题；
新增问题
- 新的方案导致多个任务过来时，需要放到临时队列中进行排队
- 临时队列会在EGG实例挂掉时任务丢失的问题，后续需要优化
后续优化
- 了解了一下后端常用的方案：Kafka消息队列、走mysql数据库、走Redis缓存
- 最终选择了基于Redis来实现，github上找了个简单易用的开源方案：bull
- 最终调整后任务处理流程如下：
