近期项目进入收尾阶段, 业务问题处理完毕,但第一次安装应用时候动画会比较卡,主要表现在push新页面和底部弹窗上面, 最初以为是内存问题, debug状态内存占到了500M 按道理也不算太高, 不至于卡顿.
第一时间在交流群里咨询,没有什么结果,就不断的去查找原因.
一、 终于功夫不负有心人, 找到了问题所在:----shaders编译卡顿
1、如果一个App在第一次运行时出现了animation卡顿，后来相同的animation却变得流畅，那么很可能是shaders编译 导致的卡顿。
2、从技术上讲，shaders是在 GPU（图形处理单元）上运行的一段代码。 首次使用shaders时，需要在设备
上对其进行编译。 编译可能会花费数百毫秒，而流畅的显示帧需要在 16 毫秒内绘制，才能实现
60 fps（每秒帧数）的显示。
3、因此，一次编译可能会导致数十帧丢失，并将 fps 从 60 降至 6。这就是编译卡顿。 在编译完成后，
animation应该是流畅运行的。
二、找到了原因,那么就需要处理这个问题.
解决办法为: SkSL warmup
简单讲,就是我们在打包前先把相关的动画运行一遍, 并换存在一个SkSL本地文件中, 打包时候把这个SkSL
文件打进app安装包里面, 从而解决动画卡顿的问题
三、具体解决变异卡顿的步骤
1、运行app(手机真机)
命令: flutter run --profile --cache-sksl --purge-persistent-cache
// 执行完app启动起来, 将原本卡顿的页面或者动画相关的业务执行一遍,尽可能多
四、将动画缓存到本地SkSL文件中
2、命令: M
五、项目文件中产生一个新文件flutter_01.sksl.json
image.png
六、根据自己的需要进行打包
3、打包成app(自己导出ipa即可进行真机测试)
命令: flutter build ios --bundle-sksl-path 生成的文件名.sksl.json
4、打包成ipa用于发布到app store
命令: flutter build ipa --bundle-sksl-path 生成的文件名.sksl.json
5、混淆打包
命令: flutter build ipa --bundle-sksl-path 生成的文件名.sksl.json --obfuscate --split-debug-info=debug_info
七、补充一下安卓打包
命令: flutter build apk --target-platform android-arm64 --split-per-abi --obfuscate --split-debug-info=debug_info
网友评论