RTC Dev Meetup:Flutter 开发实战与前景展望(一)

阅读数:43 2019 年 11 月 30 日 16:53

RTC Dev Meetup:Flutter 开发实战与前景展望(一)

大家好,我是郭树煜,Github GSY 系列开源项目的作者,系列包括有 GSYVideoPlayer 、GSYGitGithubApp(Flutter\ReactNative\Kotlin\Weex) 四大版本,目前总 star 在 17k+ 左右,主要活跃在掘金社区,id 是恋猫的小郭,主要专栏有《Flutter 完整开发实战详解》系列等,平时工作负责移动端项目的开发,工作经历从 Android 到 React Native 、Weex 再到如今的 Flutter ,期间也参与过 React 、 Vue 、小程序等相关的开发,算是一个大前端的选手吧。

这次主要是给大家分享 Flutter 相关的内容,主要涉及做一些实战和科普性质的内容。

一、移动开发的现状

恰逢最近谷歌 IO 大会结束,大会后也在线上线下和大家有过交流,总结了下大家最关系的问题有:

1、谷歌在 Kotlin-First 的口号下又推广 Dart + Flutter 冲突吗?

这个问题算是被问得最多的一个,先说观点:我个人认为其实这并不冲突,因为有个 误区就是认为跨平台开发就可以抛弃原生开发!

如果从事过跨平台开发的同学应该知道,平台提供的功能向来是有限的,而面对产品经理的各种 “点歪技能树” 的需求,很多时候你是需要基于框架外提供支持,常见的就是 混合开发或者原生插件支持 。

所以这里我表达的是,目前 Kotlin 和 Dart 更多是相辅相成 ,而一旦业务复杂度到一定程度,跨平台框架还可能存在降低工作效率的问题,比如针对新需求,需要重复开发 Android/IOS 的原生插件做支持,这也是 Aribnb 曾经选择放弃 ReactNative 的原因之一。

与我而言,跨平台的意义在于解决的是端逻辑的统一 ,至少避免了逻辑重复实现,或者 iOS 和 Android 之间争论 谁对谁错 的问题,甚至可以统一到 web 端等等。

2、React Native 和 Flutter 之间的对比

Flutter 作为后来者,难免会被用来和 ReactNative 进行对比,在这个万物皆是 JS 的时代, Dart 和 Flutter 的出现显得尤为扎眼。

在设计上它们有着许多相似之处,响应式设计 /async 支持 /setState 更新 等等,同时也有着各种的差异,而大家最为关心的,无非 性能、支持、上手难易、稳定性程度 这四方面:

  • 性能上 Flutter 的确实会比 React Native 好 ,如下图所示,这是由框架底层决定的,当然目前 ReactNative 也在进行下一代的优化, 而对此最直观的数据就是:GSY 系列 在 18 年用于闲鱼测试下的对比数据了 。

RTC Dev Meetup:Flutter 开发实战与前景展望(一)
RTC Dev Meetup:Flutter 开发实战与前景展望(一)

同时注意不要用模拟器测试性能,特别是 IOS 模拟器做性能测试,因为 Flutter 在 IOS 模拟器中纯 CPU ,而实际设备会是 GPU 硬件加速,同时只在 Release 下对比性能。

  • 支持上 Flutter 和 React Native , 都存在第三方包质量参差不齐的问题,而目前在这一块 Flutter 是弱于 React Native 的 ,毕竟 ReactNative 发展已久,虽然版本号一直不到 1.0,但是在 JS 的加持下生态丰富,同时也是因为平台特性的原因,诸如 WebView 、地图等控件的支持上现在依旧不够好,这个后面也会说道。
  • 上手难易度上, Flutter 配置环境和运行的“成功率”比 React Native 高不少 ,这里面有 node_module 黑洞这个坑,也有 ReactNative 本身依赖平台控件导致的,至少我曾经试过接手一个 ReactNative 跑了一天都没跑起来的经历,同时 Flutter 在运行和 SDK 版本升级的阵痛也会少很多。
  • 稳定性: Flutter 中大部分异常是不会引起应用崩溃 ,更多会在 Debug 上体现为红色错误堆栈,Release 上 UI 异常等等。

如果你是前端,我会推荐你先学 ReactNative,如果你是原生开发,我推荐你学 Flutter 。

在 React Native 0.59.x 版本开始,React 已经将许多内置控件和库移出主项目,希望模糊 React 和 React Native 的界线,统一开发,这里的理念和 Flutter 很像。

Flutter 暂时不支持热更新!!!!!!!!

二、Flutter 实战

1、Dart 中有意思的一些东西

1.1、var 的语法糖和 dynamic

var 的语法糖是在赋值时才自推导出类型的 ,而 dynamic 是动态声明,在运行时检测,它们的使用有时候容易出现错误。

如下图所以说,

  • var 初始化时被指定为 dynamic 类型的。
  • 然后赋值的时候初始化为 String 类型,这时候进行 ++ 操作就会出现运行时报错,
  • 如下图 2 如果在初始化指定类型的,那么编译时就会告诉你错误了。

RTC Dev Meetup:Flutter 开发实战与前景展望(一)RTC Dev Meetup:Flutter 开发实战与前景展望(一)

1.2、各类操作符

如下图所示, Dart 支持很多有意思的操作符,如下图:

  • 执行的时候首先是判断 AA 如果为空,就返回 999 ;
  • 之后如果 AA 为空,就为 AA 赋值 999;
  • 之后对 AA 进行整除 999 ,输出结果 10 。

RTC Dev Meetup:Flutter 开发实战与前景展望(一)

1.3、支持操作符重载

如下图所示, Dart 中是支持操作符重载的,这样可以比较直观我们的代码逻辑,并且简化代码时的调用。

RTC Dev Meetup:Flutter 开发实战与前景展望(一)

1.4、方法当做参数传递

如下图所示,在 Dart 中方法时可以作为参数传递的,这样的形式可以让我们更灵活的组织代码的逻辑。

RTC Dev Meetup:Flutter 开发实战与前景展望(一)

1.5、async await / async* yield

在 Dart 中 asyncawait/async*yield 等语法糖,代表 Dart 中的 Future 和 Stream 操作,它们对应 Dart 中的异步逻辑支持。

sync* / yield 对应 Stream 的同步操作。

评论

发布