uni-app 原生tabbar设置选中图片为GIF图，打包为APP后，在IOS内GIF速度变得很慢
uni-app 原生tabbar设置选中图片为GIF图，打包为APP后，在IOS内GIF速度变得很慢
操作步骤：
- 点击tabbar卡顿
预期结果：
- 跟安卓一样，正常速度，无卡顿
实际结果：
- 卡顿
bug描述：
- 原生tabbar设置选中图片为GIF图，打包为APP，在IOS内GIF速度变得很慢（附demo代码）
| 信息类别 | 详细信息 |
|---|---|
| 产品分类 | uniapp/App |
| PC开发环境 | Windows |
| PC操作系统版本 | win10专业版20H2 |
| HBuilderX类型 | 正式 |
| HBuilderX版本 | 3.1.18 |
| 手机系统 | iOS |
| 手机系统版本 | iOS 13.4 |
| 手机厂商 | 苹果 |
| 手机机型 | iPhone8 |
| 页面类型 | vue |
| 打包方式 | 云端 |
| 项目创建方式 | HBuilderX |
更多关于uni-app 原生tabbar设置选中图片为GIF图，打包为APP后，在IOS内GIF速度变得很慢的实战教程也可以访问 https://www.itying.com/category-93-b0.html
5 回复
此问题已修复请更新HX
更多关于uni-app 原生tabbar设置选中图片为GIF图，打包为APP后，在IOS内GIF速度变得很慢的实战教程也可以访问 https://www.itying.com/category-93-b0.html
在iOS中，原生tabbar使用GIF作为选中图标时出现速度变慢或卡顿，是由于iOS系统对GIF动画的原生支持不如安卓流畅，尤其在tabbar这种高频交互组件中。这属于平台差异问题，并非uni-app框架缺陷。
解决方案：
- 改用序列帧动画：将GIF分解为多张静态图片，通过CSS或JS控制逐帧切换，可提升iOS端性能。
- 减少GIF复杂度：降低帧率（建议≤15fps）、减少尺寸和颜色数，优化文件体积。
- 使用APNG格式：iOS对APNG兼容性更好，可替代GIF实现动画效果。
- 自定义tabbar：放弃原生tabbar，使用view组件自行实现tabbar，通过
uni.switchTab或页面栈管理切换，可完全控制动画行为。
代码调整示例（序列帧方案）：
.tab-icon {
animation: tabFrame 0.6s steps(6) infinite;
}
[@keyframes](/user/keyframes) tabFrame {
from { background-position: 0 0; }
to { background-position: -600% 0; }
}