timzaak / blog

8 stars 1 forks source link

Flutter #92

Closed timzaak closed 1 year ago

timzaak commented 2 years ago

最近用 Flutter 做了一个 iOS App, 感觉不错。 项目初始,还考虑 React-Native, 毕竟有前端web人员的加入,这样会好上手一些,但考虑到 React-Native 本身的限制 和 Gamfication App 的趋势,Flutter 会更值得投资,毕竟它自身有2D游戏Framework,做动效会更流畅、方便、兼容一些。 整个项目,大约写了一个月,初期遇到的困难是 API 的熟练度和状态管理框架的选择。 Flutter在 UI API 的设计上,优先考虑Google 的Material UI实现,然后提供 iOS 风格的API,其iOS 组件的API可定制化相对差不少,若对UI有特殊需求,最好是在 Android UI 组件上进行定制,常见UI需求调用第三方库即可。 状态管理框架我选择了Redux, 和Web开发项目相比, App 端的页面与页面之间的数据联系会紧密不少,经常会遇到删除某一条详情信息触发上一页面列表更新的情况。所以最好所有状态都扔进 Redux 里面去,方便页面间信息传递。但 dart 语言没有 data/case class immutable数据结构,需要引入freezed 来解决(会生成很多模版代码),进而减少Redux触发的不必要UI更新。

后面要尝试其他的状态管理方案,总感觉 Redux 在 Flutter 的这套体系下有些笨重。但在对比 Provider 后,虽然后者有更多的定制化API,但使用难度会有所增加,看其API设计特像我很早用过的 Flux,思来想去,性能并不一定会比用了 freezed 的 Redux 高多少,所以后面关于状态管理框架的选型还需要再考虑。

我后面面仔细计算了一下。 Redux 在引入 freezed 后,每一次变更,依旧会产生 StoreConnect convert 计算开销。所以,convert 里面不要塞过多的数据转换,若 store 联动性过强,且在单个 Trunk 中经常涉及多次更新时,还是需要考虑引入Provider,两者混合用也是可以的。

CustomPainter 这个API可以自定义绘制,基本上2D效果都OK。 再加上 AnimationController Tween API, 动效也没什么问题。

这个项目,从最终成品看,UI 还原度比较高,流畅度也很好。估计以后的App开发,直接上 Flutter 就好了。(PS:由于小作坊,尚未能在 Android 低端机器上做性能测试)

timzaak commented 1 year ago

我又再搞 音视频 处理工具,技术选型出现错误,虽然完成度还可以,但后续更新基本卡死,只能再重构一遍。

当前的设计思路是 用 Flutter 实现预览效果,用 ffmpeg 命令行导出,但在模拟播放的时候,各种有延迟,约有500ms,是硬伤,虽然通过动画掩盖了一些,但还是会对使用体验有较大的影响。

以后若有机会重构,需要用 gstreamer + flutter texture 来做音视频 处理。

当要做市场上没有通用方案的东西,又想做的精细的时候,就需要掌控更底层的东西。

timzaak commented 6 months ago

Flutter 最新版本渲染引擎 Impeller 已经支持Android、iOS、MacOS,后续支持 Windows、Linux 只是时间问题。 预估两年后 3D渲染生产可用。

目前App开发,实在找不到理由去使用原生框架做 App 级别的开发。

timzaak commented 9 hours ago

Flutter 桌面支持优先级下降,在 Google 内部的优先级也有所下降。反倒是 React Native 发展的越来越好:2D动效可基于 React Native Skia 去做。

以后再做技术选型,还需要两者都详细研究一下。