Hello,咱们好,我是 Flutter GDE 郭树煜,今日的主题是科普向的共享内容,首要是带咱们更全面的去了解 Flutter ,尽或许协助咱们破除一些误解,共享内容不会特别长,可是应该会协助你重新认识下 Flutter

Flutter 发布至今大概有 6 个多年头,信任现在咱们关于 Flutter 也不至于太陌生,但或许有的人关于 Flutter 还处于「一知半解」的状况,所以本次共享的首要意图是给咱们普及一些 Flutter 常识,解读一些 Flutter 常见的误解,带你拨云见月,重新认识 Flutter 。

所以今日不讲技能完成,只谈风花雪月。

社区说|Flutter 一知半解,带你拨云见月

从流言开端

社区说|Flutter 一知半解,带你拨云见月

那首先咱们从“流言”开端,其实 Flutter 从出道以来就一向备受争议,不管是写法仍是言语,都在一段时间内饱尝“歧视”,现在再回过头来看,会发现这关于 Google 来说是「基础操作」:

就像 Android 盘活了 Kotlin 和 Gradle 相同,Flutter 也盘活了 Dart ,它们之间有着相得益彰的联系

Dart 作为 Flutter 的开发言语,它原本处于竞赛失利的「雪藏项目」,所以它的没什么前史包袱,能够轻装上阵合作 Flutter 的脚步。

尽管一开端挑选 Dart 会导致和 JS 与 Kotlin 等的生态分裂而带来「抵触」,可是正如前面所示,在这一方面,谷歌无疑很擅长盘活,而 Dart 从 Dart 1 到 Dart 3 ,也很好的合作着 Flutter 的脚步在逐步生长。

当然,另一个方面,这和传闻中 Dart 项目组就在 Flutter 近邻大概有联系,至少沟通便利。

当然,Flutter 的跨渠道设定也给它带来了诸多“负面” 的 buff,其中一些流言在开端的时候能够说十分盛行,例如:

社区说|Flutter 一知半解,带你拨云见月

其实咱们只需略微思考一下,假如由于是谷歌的技能,就无法上架 iOS 的 App Store 这显着就不合理,而这个流言更多来自于:

由于 Flutter 开发会让 iOS 原生开发丢失,所以苹果需求保护自己的开发者。

这儿其实是运用了大多数人的误区,不管是运用 Flutter 仍是 React Native ,你只需开发 iOS 和上架 App Store ,就不可避免需求 Xcode 和 MacOS ,这关于苹果来说并不是坏事,由于或许更多不是全职的 iOS 开发会投入到 Apple 的系统里,别的:

社区说|Flutter 一知半解,带你拨云见月

Flutter 尽管协助完成了上层的 UI 和逻辑业务,可是底层交互,构建打包和渠道支撑都离不开原生开发的支撑, 所以:

Flutter 会在必定程度揉捏 iOS 的生态,可是从另一个视点,也会让其他生态的人触摸和运用 iOS ,乃至 Flutter 的 Plugin 必定程度还在为 Swift 的推行供给支撑

乃至之前还有由于 “Flutter 运用的是 Material 风格的 UI ,所以无法上架” 的言辞,按照这个理论,那么作为头部运用的 Twitter ,浓厚的 Material 风格产品应该也在此列才是,而且 Flutter 也有 Cupertino 风格的控件,仅仅没想到产品规划风格都会被用来变成一个打击的理由。

用 Flutter 开宣布什么风格的运用,彻底看你的运用方式

事实上从 Flutter 的 UI 完成上,Flutter 和 React Native 的不同之处就在于它的控件都是独立于渠道的自烘托,所以它更像 Unity 相同的独立游戏引擎,已然 Unity 都不是问题,那么 Flutter 天然也仅仅 App Store 技能生态下的一个小装点。

更何况 App Store 的中心是运用提成,上架运用越多,需求经过渠道的抽成或许就越多,只需你契合 App Store 的 Guideline 要求,你用什么技能上架并不会成为上架不了的原因。

终究,再介绍一个新鲜落地的消息,前几天微信发布了全新的小程序新烘托引擎 Skyline 正式版,声称加载速度提高 50% 以上,而网友经过抓包,确认是 Skyline 的烘托是 flutter 制作计划 。

社区说|Flutter 一知半解,带你拨云见月
社区说|Flutter 一知半解,带你拨云见月

微信小程序运用 Flutter 烘托,更首要是其烘托更加精密可控,同步光栅化的策略,能够更好处理部分烘托、原生组件融合等问题。

当然,这儿微信小程序运用的是 flutter 的烘托形式,而不是 flutter 开发方式,开发依然是原本的套件,仅仅 Skyline 做了一层转化,这也是大厂关于 Flutter 常见的玩法。

Flutter 的定位

接下来就不得不聊一聊 Flutter 的定位,其实 Flutter 在发布之后,由于跨渠道的“招黑” 特点,天然不可避免会有环绕跨渠道来做焦虑的自媒体,这和前段时间 AI 盛行的“焦虑”氛围相似。

已然前面有“尬黑”,那么必定也有“尬吹”的存在,如下图便是 Flutter 前期最常被用的“尬吹”场景:

这些“尬吹”不只会给人带来焦虑,更会激起咱们的抵触心理,潜移默化让人觉得,Flutter 的定位便是过来争夺 Android 和 iOS 生态,是不死不休的局势。

社区说|Flutter 一知半解,带你拨云见月

可是其实 Flutter 的定位并非如此,尽管 Flutter 的开展在不可避免会有揉捏到部分原生开发的状况,可是 Flutter 的实际意图并不在此,或者说咱们的视角和 Flutter 团队并不在一个层面。

举个例子,在之前我建议过一个简略问卷,如下图所示,关于「Flutter 你更常用的 IDE 东西」的核算下,有 71.9% 挑选是运用 Android Studio 作为开发东西。

社区说|Flutter 一知半解,带你拨云见月

可是关于官方核算的数据,能够看到这个状况只能对应到 “部分” 场景,例如 “软件工程师”和“技能主管” 等头衔的人会更或许运用 Android Studio 开发 Flutter 。

这在咱们的认知里形似没什么问题,由于感觉 flutter 开发许多都是从 Android 开发转换过的,所以更习惯用 Android Studio 好像没什么缺点。

社区说|Flutter 一知半解,带你拨云见月

可是其实总体趋势仍是在 VS Code ,由于在全球,除了开发者之外,还有运用 Flutter 的「非开发者存在」,他们的角色或许是学生、规划师、PM 等非专业开发人员,而 Flutter 团队的理念是:

社区说|Flutter 一知半解,带你拨云见月

Flutter 不会在专业和非专业开发人员之间划出一条强硬的边界,由于今日的许多学生和业余爱好者开发人员明日也能够成为专业人士

例如 Flutter 上饱尝争议的 GetX 的作者,他主职业是一个名律师,可是热爱开发,他花了十年时间从事网络安全和网络违法作业,后边开端学习了 Dart 言语,然后学习了 Flutter,然后开端然后开源活动。

所以官方的商场定位绝不是去掠取和转化 Android 、iOS 、Web 和 PC 等原生开发者,它有更多的愿景,是希望能够供给给非专业人士具有开发的才干,所以 Flutter 的发布会上,也屡次提及了 FlutterFlow 等地代码渠道,别的也有相似 Daro 的 Flutter 的低代码渠道。

Flutter 作为跨渠道 UI 结构,它供给的是全渠道的 UI 和逻辑支撑,经过下降开发门槛和提高代码复用率来拓宽技能才干,这是 Flutter 团队的愿景,仅仅回归到咱们开发者的视角,就或许变成一种揉捏。

不过另一方面,随着技能的成熟,开发的门槛原本就会越来越低,例如:

现阶段 Android 和 iOS 作业生态的改变,并非归咎于跨渠道结构的呈现,而是技能越来越成熟,资源越来越多,开发门槛也天然随着下降,现在开发 Android 起手一套官方 Jetpack 系统,完善程度确实不像从前 13 年那样什么都需求靠“自己”。

随着设备的硬件支撑也越来越强,官方配套越来越完全,跨渠道的需求天然也就越来越多,由于提高资源的重复运用是生产中的一个必然趋势,所以就像 Compose 也在走跨渠道的支撑

所以从我的视点去看,跨渠道并不是彻底是揉捏,相反还有协助 A 渠道的开发者能够触摸到 B 渠道的东西,反之也是,必定程度也是提高了 AB 两个渠道的活跃才干。

别的,Flutter 这个定位从最近的 Web 更新也能够看出来,在 Flutter 3.10 关于 Web 的发布里,官方就对 Flutter Web 有清晰的定位:

社区说|Flutter 一知半解,带你拨云见月

“Flutter 是第一个环绕 CanvasKit 和 WebAssembly 等新兴 Web 技能进行架构规划的结构。”

Flutter 团队表明,Flutter Web 的定位不是规划为通用 Web 的结构,相似的 Web 结构现在有许多,比方 Angular 和 React 等在这个范畴体现就很出色,而 Flutter 应该是环绕 CanvasKit 和 WebAssembly 等新技能进行架构规划的渠道。

所以 Flutter 自身的定位就不是去竞赛和转化开发者,例如在 Web 范畴,它更多是对前沿技能的尝试:Dart 已经开端支撑直接编译为原生的 wasm 代码,一个叫 WasmGC 的垃圾收集完成被引进到规范里,未来由于 WebGPU 的落地,WebGPU + WebAssembly 在未来也或许让 Flutter Web 支撑全新的 Flutter Impeller 引擎

PS:这儿的 WebGPU 来自 W3C 制定的规范,与 WebGL 不同,WebGPU 不是依据 OpenGL ,它是一个新的全新规范,能够供给在浏览器制作 3D 的全新完成,它归于 GPU硬件(显卡)向 Web(浏览器)敞开的低级 API,包含图形和核算两方面相关接口。

所以 Flutter 或许会转化一些原生开发,可是并不会冲击原生开发,Flutter 的愿景和意图都不是这个。

Flutter 的限制和未来

说了那么多正面的,那 Flutter 有什么样的限制?其实是结构就会有它的限制性,而 Flutter 的限制很大程度来自它的优势。

这儿咱们简略回顾下跨渠道的结构的开展:

  • 开端的跨渠道结构如 Cordova ,是经过 WebView 加载本地 h5 资源完成 UI 跨渠道,然后 js bridge 和原生渠道交互调用 Plugin 来完成原生调用
  • 第二阶段是为了功能而呈现的 React Native 和 Weex ,经过统一的前端标签控件转化为原生控件进行烘托,然后提高了功能,不过由于是经过原生控件烘托,所以存在 UI 会有共同问题和兼容适配的本钱。
  • 第三阶段呈现在了 Flutter 上,Flutter 经过独立烘托引擎,运用 GPU 直接烘托控件,然后避免了署理烘托的功能开销,一起也确保了不同渠道上 UI 共同。

这么看好像 Flutter 更优异,那为什么说限制性?

限制

由于这种独立烘托 UI 的完成,让 Flutter 的 UI 烘托树脱离了原生渠道,这时候,假如你需求在 Flutter 里接入原生控件,那么接入本钱和对功能的影响都会比较大。

事实上开发 App 就不可避免需求接入 WebView 、地图、广告、视频等原生 UI ,所以在很长一段时间, Flutter 每个版本都在为接入原生控件而尽力调整,比方 Android 至今已经有个三次较大的 PlatformView 接入改变,目前基本上算是能够完成接入运用,可是还存在一些限制,例如:

3.10 ,当 PlatformViews 呈现在屏幕上时,Flutter会限制 iOS 上的刷新率以减少卡顿,当运用显示动画或可翻滚时,用户或许会在运用呈现 PlatformViews 时注意到这一点。

社区说|Flutter 一知半解,带你拨云见月

详细的咱们就不展开,感兴趣能够看我了解发过的文章:

  • Flutter 3.0下的混合开发演进

  • 离别 VirtualDisplay ,拥抱 TextureLayer

  • Flutter 深化探索混合开发的技能演进

别的还有的限制便是「热更新」,尽管说 Flutter 不是不能支撑热更新,乃至 Flutter 团队的元老之一 Eric 在离任之后,也创立了 shorebirddev 来支撑 Flutter 热更新,可是 Flutter 自身的特点,其实十分不适合热更新。

由于 Flutter 在 Release 下是编译为 AOT 的可执行二进制代码,而下发二进制代码原本便是 Google Play 和 App Store 的制止行为,当然国内也有许多经过下发各种文本,然后经过映射或者署理的方式去更新 Flutter ,不过这种操作必定程度上提高了保护本钱和下降了功能。

而 shorebirddev 就更斗胆,直接 fork 了一个 Flutter 分支进行魔改,然后支撑热更新的才干,为此目前还不支撑运用了 shorebirddev 的 Flutter App 去上架商场。

当然,未来有或许会支撑,比方官方已经表明能够上架的 iOS 正在支撑中。

社区说|Flutter 一知半解,带你拨云见月

还有一个限制便是文本排版和编辑,Flutter 在文本排版上的限制,由于是全新的独立引擎,所以它具有一套自己独立的文本烘托和排版逻辑,而和开展沉积多年的 Web 排版相比,能够说是足足的「萌新」,不管是在多言语中文的兼容上,仍是在字体字形的问题上,Flutter 都存在需求时间去调整的细节问题。

乃至由于最近换了新的 Impeller 引擎的原因,文本上需求修复的问题会更多

社区说|Flutter 一知半解,带你拨云见月

社区说|Flutter 一知半解,带你拨云见月

例如 Impeller 标签下就有许多关于文本和排版相关的问题。

社区说|Flutter 一知半解,带你拨云见月

别的,前面咱们介绍过,未来 Flutter Web 更多会投入到 Wasm 里,这也会引起一些兼容问题,例如这个页面是采用 wasm 烘托的 Flutter Web 页面,可是当咱们用插件翻译页面内容时,能够看到只有标题被翻译了,主体内容并没有。

社区说|Flutter 一知半解,带你拨云见月

这是由于此刻 Flutter Web 的主体内容都是 canvas 制作,没有 html 内容,所以无法被识别翻译,别的假如你保存或者打印网页,也是输出不了完整 body 内容。

别的一个 Web 上的限制便是 SEO ,Flutter 会让谷歌在检查网站并以为它是 3-8mb,假如运用 google 洞察力测验一个网站,会需求你的网站应该小于 1.8mb,而且必须在 1 秒内加载才干排名。

Google 和 Bing 这样的搜索引擎会依据速度、编程言语、图画自动巨细、CDN 和终究内容对网站进行排名,Google 要求机器人视图和用户视图相同。

例如运用 搜索引擎优化_renderer 或许会违反谷歌关于伪装的 SEO 指南,尽管看起来本质上是在 Text 中添加“代替文本”,但关于 Googlebot 回来的是彻底不同的 HTML 内容,这便是问题的症结所在。

终究, Flutter 开发的中后期必定仍是需求原生开发,这个是无法逃避的问题,就算社区插件生态再丰富,总之抵不住产品和老板的天马行空,比方:

尽管社区已经有完善的第三方生物认证插件,可是我终究不得不 fork 一个份自己过来修正已满意产品的特殊需求。

所以 Flutter 自身就具备它的限制性,便是长处也是缺点,是否挑选 Flutter 首要从你的产品定位和需求出发去判别。

未来

终究不得不谈 Flutter 的未来,Flutter 目前最大的改动便是全新的底层 Engine: Impeller 。

作为 skia 的代替,这是 Flutter 团队开展的必经之路,就如前面所说, skia 自身有着许多前史包袱和渠道需求考虑,没办法和 Flutter 步步紧扣,所以 Flutter 挑选开端全新的自研 Impeller 是一个十分重要的出资,它也给了 Flutter 团队更多的或许。

正如 React Native 也自研了 Hermes ,然后 JSI 开端支撑同步调用相同。

目前 Impeller 已经在正式版支撑 iOS , Android 也正在适配,它也带来了不少「阵痛期」的问题,比方一些烘托字体的问题,可是这个出资带来的收益是可观的,也许未来还或许诞生一个全新的通用 “skia” 。

别的便是游戏,近两年 Google I/O 都经过 Flutter 发布了对应的游戏,例如 Pin 和 Card 游戏,这两个游戏也展现了 Flutter 在游戏范畴的或许,Flutter 的天然设定让它有用和 unity 相似的场景,所以经过 Flutter 来完成游戏也是官方展现的别的一种或许。

社区说|Flutter 一知半解,带你拨云见月

能够看到 Flutter 在这两年的 I/O 上,把 Flutter 的游戏才干发挥的很不错,从整体 UI 和游戏体会上都很优质,特别是今日的游戏结合了 AI 生成和规划,可玩度得到了进一步提高。

终究就 Flutter 团队在 Flutter Forward 上展现的 3D 才干,由于在此之前 skia 是 2D 引擎,所以无法完整支撑 3D 的场景,而现在 Flutter 为咱们展现了它未来 3D 烘托的或许,尽管还仅仅一个 Demo ,归于画饼阶段,可是这也是 Flutter 未来的一个期待。

社区说|Flutter 一知半解,带你拨云见月

社区说|Flutter 一知半解,带你拨云见月

所以未来 Flutter 上的 3D 游戏支撑也能够期待,不过前提也是 Flutter 能把现在已有的坑都填完先。

好了,今日共享的内容就这些,谢谢咱们。