iOS 原生 vs. Flutter 评测

Posted 知识小集

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了iOS 原生 vs. Flutter 评测相关的知识,希望对你有一定的参考价值。

本人之前分别尝试用 ios 原生和 Flutter 写了同一个小应用,一个空气质量查询 App,名字叫 Aireport,目前已经分别上架了 App Store。

  • Aireport(iOS原生) 
    https://itunes.apple.com/cn/app/aireport/id1376964845?mt=8

  • Aireport Flutter(Flutter版) 
    https://itunes.apple.com/cn/app/aireport-flutter/id1390259423?mt=8

Aireport 原本是我自己在用,但是在初步学习了 Flutter 后我决定用 Flutter 最大限度的去模仿 iOS 原生版的应用,以评估 Flutter 是否有能力做到以假乱真的地步。 我们在前一篇文章 《我的第一个Flutter 应用Demo Aireport》 https://juejin.im/post/5b098c87f265da0ddd7c92f9?utm_source=gold_browser_extension 中已经探讨了 Flutter 在开发中可能遇到的问题,这篇文章我们将着重放在两者用户在实际体验中的差距。

以下测试设备为 iPhone X

安装包大小

安装包大小决定了用户等待下载的时间和可能会耗费的流量,即便是即将迈入 5G 时代的今天,我们依然需要尽量优化应用安装的大小。

Flutter 应用安装包和安装后容量:

iOS 原生应用安装包和安装后容量:

iOS 原生 vs. Flutter 评测

虽然 Flutter 的结果我多少能够猜到,但安装包 9 倍,磁盘占用 4 倍的差距还是让我感到失望,何况如果我使用 OC 开发的话安装包还能进一步缩小(WWDC 有可能将 swift 设为稳定版嵌入 iOS 系统内核,届时 swift 版将有望自动瘦身)。

iOS 原生 vs. Flutter 评测

由于项目很小就百行代码,因此这 30MB 的空间占用基本就是 Flutter 的 SDK 容量。30MB 的空间对于一款 App 来说已经是一个不小的数字,而且应用之间不能共享 SDK,有几个 Flutter 应用就会有几个 Flutter SDK。 这让技术团队在选择开发框架时不得不着重考虑一下今后 App 的容量问题。

启动速度

上面的应用容量除了影响磁盘占用外,对启动速度也会有影响。我在 iPhone X 上实测了一下,iOS 原生应用的冷启动速度大概是在 0.4 秒左右,而 Flutter 的冷启动速度在 1.5 秒左右。

iOS 原生 vs. Flutter 评测

毫无意外 iOS 这一局又占上风。Flutter 的启动过程首先会去跑完完整的 iOS 原生应用的所有流程直至第一个 ViewController 实例化后,再由 ViewController 去调用加载 Flutter SDK,初始化 Flutter 的运行时环境。 也就是说:

Flutter 应用的启动时间 = iOS原生应用的启动时间 + Flutter环境的启动时间

用户对于应用的容量占用几乎很难察觉,但是应用的启动时间对用户体验的影响绝对是致命的(虽然现在的启屏广告已经完全不考虑用户体验了)。在这一点上不知道往后 Google 团队还有没有优化的空间。

内存占用

内存占用一直是移动开发中的一个优化重点。不过目前来看 Release 版的 Flutter 在内存占用这一块也没有任何优势,SDK 拖累是一方面,单个页面内存占用也比原生多一倍。

iOS 原生 vs. Flutter 评测

注意,我们知道 Flutter 在 Build 版本中的性能和 Release 是不一样的,同一个应用,Build 版的内存占用在 100M 左右,为了热加载我也是忍了。

内存占用不仅影响着应用性能、电池损耗、 程序稳定性,最重要但是,内存占用越大,被系统干掉后台的可能性就越大。我自己的使用体验来看,iOS 原生的 Aireport 基本上大部分时间都处于休眠状态,而 Flutter 会在关闭不久后直接被系统干掉。

流畅度

从框架一出现,60FPS 似乎始终贯穿于各大 Flutter 的介绍和分析文章中,这让我们对 Flutter 的流畅度非常期待。我使用的是 Instuments 来收集 App 运行时的帧率,它跑下来的结果是这样的。

Flutter 帧率:

iOS 原生 vs. Flutter 评测

iOS 原生帧率:

乍一眼看上去两者似乎在下方的数据(平均帧率、最大帧率)没有什么差别,但仔细看红色框选的部分。这部分是页面切换的动画,很明显可以看出来 Flutter 没有在 60 帧跑完这个动画,实际帧率在 45 帧左右。而下方 iOS 原生应用达到了最大 60 帧。

此外在这张图中还可以额外提供一项信息,就是 GPU 的使用率。我们可以很明显的看到,Flutter 在 GPU 的整体占用率上是高于原生应用的,这就表明 Flutter 对于硬件性能的要求更高,以及相应的,对于设备电量的损耗也更高。

这种帧率的差距也体现在了实际使用中。无论是页面的切换,还是 ListView 的滚动,Flutter 都仅仅能达到还算流畅的程度,但明显还达不到 iOS 原生 60 帧的丝般顺滑。当然,目前的 Flutter 还处在 Beta 版,而且我个人认为,相对于安装包大小和启动速度,运行时的流畅度更容易进行优化。我相信 Flutter 将在之后的版本中进一步优化应用的流畅度,达到与原生媲美的程度。

iOS 特性支持

iOS 应用开发受益于强大的 iOS 系统和丰富的生态体系,天生就具有大量实用且不可替代的特性,例如 Bitcode 能够在云端自动优化我们 App 的代码,原生应用默认就支持增量更新、后台应用刷新等等。

很显然 Apple 赋予 iOS 应用的这些种种特性与 Flutter 应用是无缘的,如果 Flutter 能够支持热更新的化那么其可用价值就高了许多。但目前实现起来还有诸多问题,包括部署、性能问题,以及苹果对于热更新的谨慎态度。

总结

综合了目前 Flutter 在开发中的体验以及和原生应用的比较,我目前对 Flutter 的评估结果是: 再等等。

Flutter 的确提供了一种不同于目前其他跨平台开发框架的思路,也极有可能成为未来跨平台开发的标杆。如果你是个人开发,我还是建议你学习一下 Flutter,它的 Dart 语言、Widget 化、数据绑定、单向数据流等等现代特性值得你去了解。同时对于无法同时掌握多个移动开发平台的小伙伴而言,使用 Flutter 也是一种成本较为低廉的方法。 但是对于公司而言,Flutter 还无法完全投入生产环境,而且初期 Flutter 的开发成本未必会低于原生平台。

目前 Fuchsia 的开发进度还不得而知,Flutter 也还处在 Beta3 阶段。相信等 Fuchsia 正式发布的时候才是检验 Flutter 正在实力的时候。



最后,来个小小的投票吧


以上是关于iOS 原生 vs. Flutter 评测的主要内容,如果未能解决你的问题,请参考以下文章

Flutte VS RN

Flutter笔记-调用原生IOS高德地图sdk

Flutter 调用原生

如何在 Flutter 插件中调试 iOS 原生代码?

Flutter插件开发和iOS原生代码:避免应用启动时的权限请求?

VS 代码中的 Flutter 未在 iOS 模拟器中启动应用程序