Flutter和iOS原生性能对比测试

开篇

刚刚起步看了两个月Flutter，感觉和之前那些跨平台框架略有不同，我认为已经到跨平台时代的3.0（随便说说哈）。 现在Flutter是谷歌主推的一个东西，感觉还是有点期待。下面是一个Flutter的Demo和自己做的一个基本功能差不多的iOS原生Demo做一个性能对比。

正文

下文使用，从内存使用率、CPU使用率、FPS和包体积方面去做对比。注意：图片分辨率都是 1000 * 1000的量级。

Demo页面

Flutter Demo页面

iOS原生Demo页面

当然iOS和Flutter Demo从一些UI和设计风格上略有不同。但是基本在关键点上面已经做到基本一致。

CPU使用率-Flutter vs iOS原生

Flutter

上图所示，测试5分钟双图片列表滑动3分钟之前是一直下拉滑动加载图片列表。3分钟之后是静止等图片显示完。 滚动时候的尖刺是因为网络下载时候cpu使用率最高达113%，平均达55%左右。因为用到了Stateful的Widget所以会有不断刷新界面的操作所以cpu会在多图情况下cpu使用率平均38%左右。

iOS原生

上图所示，使用一开始比较经典的对比，有突刺的是滑动下载和加载图片的时候最高在115%CPU使用率。在1分钟到1分30秒区间中是滚动在已经下载好的图片，平均在18%左右的使用率。和Flutter 对比静止和滚动时候其实都是iOS原生好点。

结果

平均	最高	静止
55	113	38
18	115	0

原生略胜。

内存使用率-Flutter vs iOS原生

Flutter

测试了6分钟，其中从1分钟到3分钟不断下拉不断下载图片时间，内存最高使用率到263Mib。

iOS原生

使用SDWebImage框架之后，并且设置最大使用内存之后原生保持在 400Mib左右。

这个回合，如果不额外处理的话，Flutter胜出。

内存使用率-Flutter vs iOS原生

Flutter

这个表现良好基本在58以上，不过是因为Flutter每一秒都会刷新界面的缘故吧~~所以我不动貌似都会刷新，并且是在FPS为58以上。GPU使用率最高会利用到68%，其他都保持在30%左右。这么厉害的内存泄漏是因为使用了图片框架造成的可以忽略，不是Dart或者Flutter本来的问题。

iOS原生

iOS原生滚动的时候，这是使用SDWebImage处理结果大约都在57fps以上。GPU使用率比Flutter低，还需要优化，不过还有一个问题，Flutter静止图像的时候还会使用GPU，而原生在静止时候，就不会使用GPU了。

这方面原生略微胜出。

包体积-Flutter vs iOS原生

iOS原生	Flutter
11.4MB	213KB

Flutter没有优化的时候，比原生大10M左右，这个是因为Flutter.ipa里面App.framework和Flutter.framework包比较大，所以这个回合是原生胜。

Flutte包体大小优化可以参考闲鱼的：mp.weixin.qq.com/s/IIoaY2uw6…

但是这个包体大小已经没有什么空间可以优化了，因为逻辑比较少，所以基本做不到很大的优化。

总结

Flutter其实性能和原生不会相差十分远，但是也有缺陷，比如不断使用GPU（在Stateful控件中），而且编程风格和部分控件风格也和iOS相差比较远。还有一些生命周期方面的方法也相对少。但是Flutter有接近前端的布局语法和相对简单的Api也是让新学习的同学很快地上手。