昨天看了半天 flutter 写了 hello world。 最大的感受就是 Android 虚拟机在 windows 系统上终于飞快了啊,感觉和真机差不多了速度 。
然后,具体到 flutter 的话 ->
不是说它的性能媲美原生应用吗 ? 然而,我实践的结果是 最简单的 slider (滑动条) 联动,它有时候好像也跑不到 60 帧啊, 性能检测工具经常飘红 , 所以它是不是真的能有和原生一样的体验 ?
后来我返回去看了看它的架构 , 感觉明明就是翻版 canvas 呀 ?(也许我理解错误) ,react native 好呆也是调用原生控件才会说自己能用原生性能 ,flutter 明明就只是全新的画板(感觉有点类似游戏开发中的渲染引擎),而且实现还不全 (只支持 Android,ios, 最近好像 web 版本和 mac 版本在测试中 ,windows/linux 版本没看到消息) , 能不能说说他们做一个全新画板的意义在哪里?
语言用的 Dart , 这个感觉用起来问题不大 , 可是 为什么他们用这个语言呢 ? AOT 编译的话 , 以后 typescript 的最严格模式有没有可能会做到 类似呢 ? 可以 JIT + VM, 开发完了,AOT 编译到指定平台 ?
你们看好 flutter 吗?
大家能讲讲自己在 flutter 实践中遇到的问题(坑,或者好的方法之类的) 吗?
1
maomaomao001 OP 还有这个,嵌套写法大家怎么看呢 ? 你们觉得以后会出 类似 jsx 的 dsx 之类的吗?
第 8 分钟开始 bilibili av79096823 |
2
hst001 2019-12-16 12:33:08 +08:00 via Android 1
类似游戏引擎,暴露 API 给上层,现在地球上都是这样,原生也是。至于慢的问题试试在 release 下跑跑看效果。
|
3
optional 2019-12-16 12:40:54 +08:00 via iPhone 2
现在就两个端。flutter 优势并不明显(节约了一个平台的开发量,但是需要踩两个平台兼容性的坑,还要对一些原生功能做取舍)
|
4
morethansean 2019-12-16 12:41:16 +08:00
按你的说法,所有 ui 都是 canvas,原生 ui 也是 canvas...
|
5
maomaomao001 OP 而且,我觉得是个极其基础的功能 (配置保存 , 类似 Android 开发里的 sharedpreference 之类的),也才最近才出官方库的样子 ...
|
6
maomaomao001 OP @morethansean 额,从某种角度,这么说好像也没什么问题 ,but (他们为什么不试试在现有的 canvas 上做这些功能呢... )
|
7
WildCat 2019-12-16 12:49:11 +08:00
@maomaomao001 嵌套很容易重构为更小的 component,在 VSCode 和 IntelliJ 里都很容易直接 extract widget。把 flutter 应用到实际项目里避免不了这样的重构。真正用的时候并不会存在这个问题。
性能的话,根据个人感知,iOS 上优化反而差一些。Android 性能比较好。 |
8
maomaomao001 OP @hst001
我昨天是用了差不多这样的联动滑动条 (没试 relese 版本) ,就是 Android studio ( flutter plugin )自带的那个看帧数的工具 , 真的是一大段红 (渲染耗时 超过 16ms ) ``` import 'package:flutter/material.dart'; import 'package:flutter/cupertino.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( title: 'Flutter Demo', debugShowCheckedModeBanner: false, theme: ThemeData( primarySwatch: Colors.blue, ), home: MyHomePage(title: 'Flutter Demo Home Page'), ); } } class MyHomePage extends StatefulWidget { MyHomePage({Key key, this.title}) : super(key: key); final String title; @override _MyHomePageState createState() => _MyHomePageState(); } class _MyHomePageState extends State<MyHomePage> { int _counter = 0; double s = 0; void _incrementCounter() { setState(() { _counter++; }); } void setSVal(double v) { setState(() { s = v; }); } @override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(widget.title), ), body: Center( child: Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Text( 'You have pushed the button this many times:', ), Text( '$_counter', style: Theme.of(context).textTheme.display1, ), Slider( min: 0, max: 100, value: s, onChanged: setSVal, ), CupertinoSlider( min: 0, max: 100, value: s, onChanged: setSVal, ), Text('$s'), ], ), ), floatingActionButton: FloatingActionButton( onPressed: _incrementCounter, tooltip: 'Increment', child: Icon(Icons.add), ), ); } } ``` |
9
maomaomao001 OP @WildCat 可能真的是 relese 出来真的很快吧 , 不过,我的直观感受,flutter 明显比 react native 不流畅...
|
10
Kilerd 2019-12-16 12:54:29 +08:00
你要知道最开始 flutter 就是为了推广 Dart 服务的。 你说 ts 能不能做到 Dart 这样,肯定可以,但是其中的因由和利益关系决定了 Dart 应该不会换。
|
11
hst001 2019-12-16 13:10:01 +08:00 2
@maomaomao001 #6 这是做 UI,又不是通用游戏引擎,就算游戏引擎也有很多厂商选择自研,底层服务设计主要还是看上层需求。要考虑状态、结构管理,可能包括栅格化等,这里的需求就是我们看到的 flutter 框架那一套规则了。
如果你不是发 debug 包出去,简单应用性能问题不是问题,复杂应用则需要对 flutter 有深入一些的了解,知道如何避免一些低性能的处理方法(我感觉说了一句废话,哪门语言不是这样子)。 |
12
souths 2019-12-16 13:58:49 +08:00
可以这么理解,开发时跑的是网页,慢,上线跑的是二进制文件,快。但是这个其实是 UI 框架非 UI 部分还是需要原生支持
|
13
ai277014717 2019-12-16 14:03:51 +08:00
1 Release/AOT 才是性能优化的版本
2 绘制引擎从底层统一 UI 差异比 RN 更彻底,面向未来嵌入式系统 3 自带类型,推导方便,优化方便。ts 应该能达到同样效果 4 中立 |
14
wangxiaoaer 2019-12-16 14:04:19 +08:00
@maomaomao001 #1 你说的 canvas 是不是想表达类似 java swing 那样每个组件都自己重新绘制?
|
15
lagoon 2019-12-16 14:15:34 +08:00 1
借用大佬的话,瞬间明白。
Android -> Skia -> CPU/GPU。 Flutter -> Skia -> CPU/GPU。 React Native -> Android -> Skia -> CPU/GPU。 说完了。 |
16
maomaomao001 OP @wangxiaoaer 可能算吧 ,我的点在于
以前的 react native -> 写 js 代码 -> 通过桥去生成操作原生控件 , 比如 rn 写的按钮,出来的就是平台本身的按钮 但是 flutter flutter -> 写 dart 代码 -> 用 skia (canvas) 画出组件 , 比如 flutter 写按钮,这完全和平台没关系了感觉 , 可能是为了,以后跨更多平台吧 |
17
maomaomao001 OP |
18
maomaomao001 OP @lagoon 刚刚查了一下,skia 好像还真是 android 渲染层框架
|
19
lagoon 2019-12-16 14:22:14 +08:00
@maomaomao001
有什么问题? Skia 本来就用在 Android 上,又不是为 Flutter 搞的。 在 Flutter 都还没有的是的,Skia 就是 Android 的图像引擎啊。 当然,更细致的分析,得有大佬回答,我的水平也就说成这样了。 |
20
TimLang 2019-12-16 14:23:48 +08:00
觉得嵌套问题的,建议用 ide,比如 android studio,这都不是事,而且 dart 非常好学,比 oc 或是 swift 简单多了,前端上手
应该没什么问题。 |
21
maomaomao001 OP @lagoon 话说,有没有可能,rn 是不是也许也能那么做 , 不调用系统控件了, 直接用 skia 自己画
|
22
TimLang 2019-12-16 14:25:43 +08:00 1
而且很多小公司开发人力有限,做些没什么技术壁垒的 app,比如电商 app,用 flutter 很方便,做一套,再稍微改改,两端就出来了。
|
23
lagoon 2019-12-16 14:27:25 +08:00
@maomaomao001
我猜,这就是亲儿子的好处了?开玩笑开玩笑。 至少现在 RN 不是这样。 或许目的不同吧。Google 搞 Flutter,也不单单要搞 Android&iOS,几乎肯定还有 Fuchsia OS。 |
24
sunrain 2019-12-16 14:37:05 +08:00 1
Unity"抄"了一版 Flutter,名曰 UIWidgets,支持 Unity 所有平台,但他是个游戏引擎,打包出 apk 较大。
|
25
maomaomao001 OP @sunrain 这个很强大啊看起来,unity 跨平台,别说 windows 和 mac 了 ,也许连 ps4,xbox 都能上了
|
26
sunrain 2019-12-16 14:42:10 +08:00
@maomaomao001 #25 是的,用法跟 Flutter 几乎无异。
|
27
loshine1992 2019-12-16 15:04:27 +08:00 1
Q:滑动卡顿
A:打 Release 包就不卡了 Q:Flutter 为什么用 dart ? A:dart 开发组就在旁边,有问题反馈和解决很快。 |
28
userdhf 2019-12-16 15:39:37 +08:00
你说的没错,就是省了 dom 的消耗。本质就是外挂了个画布
|
29
wvitas 2019-12-16 15:42:45 +08:00
据反馈,flutter 在高刷新率的手机上表现的不好,有待测试及验证
|
30
janus77 2019-12-16 16:07:08 +08:00
为何说媲美原生:因为架构层数和原生一样,RN 等的架构层数要多一层(用于桥接的),从理论上来讲是可以做到原生一样的。
为啥还卡顿:首先 release 比 debug 强,其次现在引擎还有待更新,所以我的第一点也只是说“理论上”。 为啥用 dart:优点比较多,最主要的是 AOT 之类,然后是语言特性( dart 和 native 直接的交互,导致他很适合做跨平台),另外就是语法简单(不是简洁),易融入前端圈。 |
31
NG6 2019-12-16 17:05:35 +08:00
我只管的感觉就是咸鱼用了以后,体验 不是很好,听说只有详情页用了,但感觉发布页也用了,全是问题,感觉没经过测试就放出来了,这么长时间都没修复,移动光标都移动不了
|
32
v2agedchen 2019-12-16 17:31:39 +08:00
列表卡顿是因为 debug 与 release 的编译模式不一样。
关于 flutter 的性能表现,有一个最直观的 app 《 The history of everything 》可以在 Google play 或者 App store 上面下载使用体验一下。 如果你用贴吧的话,有一个《贴吧内部版》,也是由 flutter 编写,体验非常好 或者也可以看看我这个开源项目,感受一下: https://github.com/asjqkkkk/flutter-todos |
33
miyuki 2019-12-16 18:17:24 +08:00 via Android
楼上这个 app 试了一下,手持 1+7pro 90Hz 肉眼还是感觉帧数没有满的样子
|
34
KeyboardManAnAn 2019-12-16 22:39:56 +08:00 1
这种完全抛弃原生自绘 UI 的套路已经很早就被 Qt 证明了是切实可行的,期待 flutter 在桌面端的表现
|
35
maomaomao001 OP @v2agedchen Android,845 处理器, 导航进入的时候 , 还有 about 页面上下滑动的时候,非常明显的卡顿延迟感 , 我都感觉我手机出问题了
|
36
v2agedchen 2019-12-17 09:33:19 +08:00
@maomaomao001 😂导航页面进入卡顿一下应该是我用代码写的那个动画效果,是代码的问题; about 页面滑动卡顿我没有遇到过,我是 redmi k20 pro
|
37
xzc2677 2019-12-17 10:26:12 +08:00 1
2. 我也好奇这一点,以前也有类似的产品,为什么这次 flutter 能掀起如此大的风浪(可能是 GG 出品?),游戏届早就用这一套了。包括 Unity, cocos2d,以及一些大厂的自研游戏引擎。
3. 据说是隔壁组是 Dart 组,就决定是 Dart 了。(近,解决问题快) 4. 比较担忧的是生态问题。flutter 应该不能复用现在 OC 以及 Swift 的一些轮子( UI 方面)。Android 方面不了解。这部分的轮子都得重新造。机遇和挑战并存吧。 |
38
maomaomao001 OP @xzc2677 何止 oc swift 没法服用,最关键的,海量的 npm 包没法服用就太难受了
|
39
maomaomao001 OP 复用
|
40
jedrek 2019-12-17 11:28:41 +08:00
@maomaomao001 你试了 Release 的性能了吗?
|
41
phantomlimb 2020-03-18 09:40:24 +08:00
我很喜欢 Flutter,学了十天,然后 4 周就写好了一个 app。很有潜力。
原生 iOS 和安卓开发我都很熟悉,我挺看好 Flutter 的,小工程都可以用 Flutter。 |