动画更轻量！我的 Lottie 文件优化秘籍

为了更好地演示 Zipic 的功能，我用 LottieLab 制作了一些 Lottie 动画。更新到 v1.8 的朋友应该已经看到了，效果还不错吧？🎉

不过如果每次都依赖在线资源，既受网络限制又增加加载不确定性，所以我决定把动画直接集成到 App 里。但随之而来的问题是：文件不能太大！ 于是我研究出一套优化工作流，现在分享给大家，希望能帮到你。💡

前言

我使用的是 LottieLab 设计动画，所以本文就以它为例。

在研究的过程中发现：虽然 LottieLab 自带的优化已经很好了，但一些开源工具还能在此基础上再优化（压缩）一波，于是我整理出了以下工作流：

LottieLab 发布并优化 → 下载优化后的 Lottie 文件 → 本地优化

举个例子：

我的设计文件 Feature4_light，原始下载大小 234.6 KB，经过完整流程优化后，最终只剩下 94.6 KB。✨

LottieLab 发布&优化

1. 点击 Export 按钮，会弹出导出窗口
2. 在左侧选择 Lottie
3. 点击 Publish version to links，等待优化完成
4. 在 Lottie Embed options 中找到 JSON URL
5. 点击 Copy link，复制链接

下载 Lottie 文件

把复制的链接粘贴到浏览器，打开页面，点击 Decompress & download，就能把优化过的 Lottie JSON 文件保存到本地。

本地优化

这一步我们用 LottieGo 来进一步优化 👉 https://lottiego.com

直接拖拽文件到页面，就能马上得到更小的结果。

如果你是 macOS 用户，还可以用 LottieGo 的桌面客户端，体验更流畅：

小结 & 一点小私心

以上就是我在使用 Lottie 动画时的完整优化流程，希望能帮到你让 App 动画更轻量！🙌

最后，想顺便介绍一下我自己开发的工具 LottieGo。

LottieGo

免费

一款简洁漂亮有实力的 Lottie 文件优化工具，页面内直接可用，当然也支持 macOS 客户端！

立即使用

起初是因为市面上的一些 Lottie 优化工具用起来不是很理想（要么效果不佳，要么体验不友好😅），所以干脆自己撸了一个。现在它已经可以轻松完成二次优化，未来我计划让它逐渐实现接近 LottieLab 的完整功能，并且额外支持 导出视频/GIF —— 这样就不用在 LottieLab 里绕来绕去啦。🚀

慢慢迭代，但方向明确，希望它能成为你日常动效处理的小帮手！