Wincer's Blog
·
Sorry，会写代码真的能为所欲为
💡
原文中文，约3800字，阅读约需10分钟。
📝
内容提要
本文介绍了一个表情包生成工具的开发过程，使用JavaScript和React实现，支持动态和静态表情包的生成，采用omggif和gif.js进行GIF处理。作者分享了开发中的挑战和解决方案，包括Blob文件支持和服务器加载问题。尽管工具尚需改进，但已具备实用性。
🎯
关键要点
- 开发了一个表情包生成工具，使用JavaScript和React实现。
- 支持动态和静态表情包的生成，采用omggif和gif.js进行GIF处理。
- 遇到的挑战包括Blob文件支持和服务器加载问题。
- 工具的设计思路是直接在浏览器端渲染，避免服务器端渲染。
- 静态图部分使用dom-to-img绘制，但在Edge浏览器上存在兼容性问题。
- 解决了多个编程中的Bug，包括Blob文件对象和服务器加载速度慢的问题。
- 工具目前具备实用性，但仍需改进，如React写法规范和用户自定义模板功能。
❓
延伸问答
这个表情包生成工具是用什么技术开发的？
该工具使用JavaScript和React开发。
表情包生成工具支持哪些类型的表情包？
工具支持动态和静态表情包的生成。
在开发过程中遇到了哪些主要挑战？
主要挑战包括Blob文件支持和服务器加载速度慢的问题。
工具的设计思路是什么？
工具设计思路是直接在浏览器端渲染，避免服务器端渲染。
静态图部分在Edge浏览器上有什么问题？
在Edge浏览器上，静态图部分由于foreignObject标签的添加，导致toDataUrl()无法工作。
这个工具目前有哪些改进的空间？
工具需要改进的地方包括React写法规范和用户自定义模板功能。
🏷️
标签
➡️
