Flutter live 18之后的移动开发技术综述

栏目: IOS · Android · 发布时间: 5年前

内容简介:移动开发技术泛指手机端的应用开发,平台主要有iOS和Android。移动开发技术大体目前可分为两类,一类是两者各有优缺点,先给出大佬的观点:移动端Web开发就像用店里买的锅炒菜,稳定快捷,做家常菜足够了。而native开发就好像不但要做菜,还要亲自打一口最合适自己的锅。虽然速度不快,虽然成本很高,但是想要做出最好吃的拿手菜,用店里的锅就是做不出那个味道。 ​​​​ ———即刻iOS leader JasonYuh

移动开发技术泛指手机端的应用开发,平台主要有iOS和Android。移动开发技术大体目前可分为两类,一类是 原生开发 ,一类是 跨平台开发

两者各有优缺点,先给出大佬的观点:

移动端Web开发就像用店里买的锅炒菜,稳定快捷,做家常菜足够了。而native开发就好像不但要做菜,还要亲自打一口最合适自己的锅。虽然速度不快,虽然成本很高,但是想要做出最好吃的拿手菜,用店里的锅就是做不出那个味道。 ​​​​ ———即刻iOS leader JasonYuh

Flutter live 18之后的移动开发技术综述

原生开发

原生开发是指使用特定语言(如 KotlinSwift )调用系统SDK开发的应用。在接触Flutter之前,我属于这类开发人员。对于原生开发,我总结出如下的优缺点:

原生开发的优点

  • 速度快,性能好,用户体验佳,原汁原味
  • 开发人员多,社区比较完善,可用的第三方库健全
  • 可访问平台的所有功能,如iPhone X的前置深度相机进行面部识别、蓝牙、GPS等
  • 有谷歌和苹果的工程师每年召开开发者大会WWDC/Google IO,更新SDK,演讲介绍best practice

原生开发的缺点

  • 开发成本高,人力成本大,需要两班人马
  • 功能更新或内容更新需要发布新版本,有审核周期
  • Swift ABI不稳定,Swift版本升级维护工作量大,因此保守的国内公司大部分代码还是用OC

上面两点是我在开发 Match问答 的过程中深有体会的两点。我与朋友分别开发和维护iOS和Android客户端,版本迭代的人力成本是翻倍的。任何的修改都要提交审核,通常第一次审核遇到的麻烦比较多,后面审核相对比较顺利,但也要平均两天的时间,这对于高速变化的互联网时代一定是不可接受的。

跨平台技术

针对原生开发人力成本和动态化不足的缺点,诞生了一些跨平台的动态化框架。根据原理可大体分为三类:

  • Html5+Webview渲染的Hybrid APP
  • 以ReactNative为代表的JS开发+原生渲染
  • 以Flutter为代表的自绘UI+Native

Flutter live 18之后的移动开发技术综述

跨平台技术与原生技术示意图 (图片来源:知乎用户 @易旭昕)

Flutter之外的跨平台技术

Html5+Webview渲染的Hybrid APP

第一类技术主要是利用原生控件 Webview 渲染网页,加载前端工程师开发好的已适配手机端的网页,这类应用也被称为 Hybrid APP 。它确实解决了原生开发带来的人力成本与动态性不够的问题。

它最大的缺点是性能问题,Webview可以理解为一个浏览器内核,上文提到的蓝牙、前置摄像头这些资源是无权访问到的。若使用到这些功能,需要用JS与原生API通信,这个部分是由 JSBridge 完成的。涉及到 通信 事情就复杂起来了,需要指定协议(规定消息的格式含义等),性能也随之降低。

以ReactNative为代表的JS开发+原生渲染

第二类技术在第一类技术的基础上进行了改进,将不堪重负的Webview替换为了原生渲染。以React Native为例,它借助React的 Virtual DOM 技术,在RN中将其渲染为原生控件树,从而大幅提升了渲染效率。

响应式编程也是React提出的一个重要思想,状态(State)改变,则UI随之改变。这样开发者只需要处理和关注状态的变化,剩下的交给框架完成,得益于Diff算法,框架可以高效的完成DOM更新操作。

如此看来,React真是非常 伟大 。Vue的作者也在一个讨论React与Vue的帖子下大方承认,再过若干年,React的历史功绩肯定在Vue之上。Flutter中也从中大量借鉴了宝贵经验。关于两者的 布局、构建、渲染、更新机制 ,后面可以展开单写一篇博客。

Flutter live 18之后的移动开发技术综述

Flutter的渲染、绘制机制示意图(图片来源:知乎用户 @JoeyChi)

国内厂商也进行了尝试,比如阿里的 Weex 和华为小米等国内厂商制定的 快应用

相比于第一类解决方案,第二类解决方案性能已经提升蛮多的了,但还是无法避开Javascript与原生的通信。而且作为 解释性 的语言,Javascript的性能好不到哪里去。

另外,当iOS/Android系统更新后,控件可能会更新,也就是虚拟DOM渲染的目标就更新了,因此不可避免的会有一段时间的空档期,等待社区控件的更新。

Flutter

Flutter的改进与性能

Flutter抛弃了JS,使用了可编译为机器码的Dart作为编程语言,底层Engine层包含了 Skia渲染引擎以及文字处理引擎,自绘了UI,同时支持iOS的 Cupertino 风格与Android的 Material 风格。

正是因为较好的解决了上面的问题, Flutter 声称可以达到 媲美原生 的效果。关于原生与Flutter的性能对比,可以参考 Flutter和原生应用性能对比

在假设他能够做到独立、第三方的前提下,结论是:android 原生在内存、CPU 资源占用方面要低于 flutter,并且安装包的体积也要小于 flutter,所以,不考虑其他因素,单纯从性能角度来说,android 原生肯定是要优于 flutter 的。但 flutter 也有它的优点,比如跨平台的开发、毫秒级的热重载等等,另外跨端开发也逐渐的流行起来,所以,我们在学好android原生的基础上,对跨端开发也要抱有积极的心态。

Flutter的历史

Flutter是谷歌最早于2017年5月推出的一套 跨平台、开源UI框架 ,初衷是同时支持 iOS、Android 开发,并且是传说中的操作系统 Fuchsia 的默认开发套件,使用 Dart 语言编写。

Flutter live 18之后的移动开发技术综述

Flutter的特点

其实学习Flutter有一段时间了,他的优点挺多,官方总结如下:

  • 界面精美
  • 速度快
  • 支持热重载
  • 开放

就我自己使用Flutter一段时间以来的实际体验,展开介绍一下。Flutter一直强调对屏幕的像素级掌控,让开发者不受限的堆叠任何图形、视频、文本和控件。Flutter内置的 Widgets 非常精美,最大程度的实现了Material Desig,因此应用的外观 下限 是有保证的(^_^)。

Flutter live 18之后的移动开发技术综述

Flutter官方给出界面样例

速度快是Flutter 时的初心,媲美原生应用的速度是他的口号。 性能方面无需多言,相比于其他跨平台方案是有优势的,但比原生还是有一些差距。特别是iOS平台,由于没有内置Skia 2D加速图形引擎,会使IPA包的大小多出一截。

支持热重载这点对于开发者来说是非常爽的,开发者做出一点点修改,不用重启整个应用,经历漫长的等待了,在亚秒级别的等待后就能看到更新,非常方便。另外,即使出错了,也可以记住Context,在开发者修复代码后,恢复之前的Context,不用担心typo或者测试过程中,错误很难复现的问题。综合以上两点,Flutter称之为 Stateful Hot Reload

Flutter live 18之后的移动开发技术综述

Flutter开发界面,支持热重载

Flutter是开源的,插件也丰富,有类似于cocoa pod和npm的 社区 ,不需要重复造轮子了,开发者也可以发布自己的轮子给别人使用。同时,也可以像使用React一样,仅仅将Flutter作为view层的解决方案,逻辑使用Kotlin或Swift进行开发。


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

微信小程序入门指南

微信小程序入门指南

知晓程序 / 电子工业出版社 / 2017-6-1 / 49

《知晓程序:微信小程序入门指南》是一本分析小程序生态、解读小程序产品设计与开发的入门图书。全书共 9 章,全面讲解了小程序的基本知识、大家如何看待小程序、小程序对行业的影响、小程序对开发者的影响、小程序对用户的影响、开发小程序需要的准备工作等内容,并深入解读了小程序的官方文档。 读者在阅读《知晓程序:微信小程序入门指南》之后可以清楚小程序与订阅号、服务号的区别,了解小程序适用的场景,认识小程......一起来看看 《微信小程序入门指南》 这本书的介绍吧!

RGB HSV 转换
RGB HSV 转换

RGB HSV 互转工具

HEX HSV 转换工具
HEX HSV 转换工具

HEX HSV 互换工具

HSV CMYK 转换工具
HSV CMYK 转换工具

HSV CMYK互换工具