乐趣区

关于flutter:Google-IO-2023-推出Flutter-310-快来看看都有哪些变化

本文首发自[慕课网],想理解更多 IT 干货内容,程序员圈内热闻,欢送关注 ” 慕课网 ” 及“慕课网公众号”!

作者:CrazyCodeBoy | 慕课网名师


往年的 Google I/ O 满满的 AI 与狠活,而且还推出 Flutter 3.10,接下来就让我带你一起来看看 Flutter 3.10 都有哪些变动吧!

首先看此次更新的亮点:

    公布了 Dart 3,并引入到 Flutter 3.10 中;
    iOS 默认应用了 Impeller;
    Material 更新到了 M3 版本,并且很多控件在 M3 版本下都有更新;
    Web 能够无 iframe 嵌套到其余利用;

另外,Flutter 3.10 还包含许多 Web、挪动端、图形、平安等方面的改良。

引擎(Engine)方面的更新

Impeller

在 3.7 稳固版本中,Flutter 官网在 iOS 上预览了 Impeller。自那时以来,Flutter 官网收到了许多用户的贵重反馈,并加以解决。在此版本中,Impeller 有超过 250 个提交,Flutter 官网将 Impeller 设为 iOS 上的默认渲染器。应用 Flutter3.10 构建的所有 iOS 利用默认应用 Impeller。这些 iOS 利用将具备更少的卡顿和更稳固的性能。

自 3.7 版本以来,Impeller 在 iOS 上改善了其内存占用。Impeller 应用更少的渲染通道和两头渲染指标。在较新的 iPhone 上,启用有损纹理压缩能够减小内存占用,而不影响保真度。这些改良也显著进步了 iPad 的性能。

以 ”Wonderous” 利用中的 ”pull quote” 屏幕为例。这些改良将简直缩小了这些屏幕的一半内存占用。缩小内存应用还使 GPU 和 CPU 的负载略微升高。”Wonderous” 利用可能无奈察觉到负载的升高。之前它的帧曾经在估算范畴内渲染,但这一变动应缩短电池的使用寿命。

Impeller 还可能更快地实现受欢迎的性能申请。其中一个例子是在 iOS 上反对更宽泛的 P3 色调范畴。无关该性能的形容,请查看本文的其余局部。

社区的奉献放慢了 Flutter 官网的停顿,尤其是 GitHub 用户 ColdPaleLight 和 luckysmg。他们编写了多个与 Impeller 相干的补丁,进步了保真度和性能。

尽管 Impeller 满足了大多数 Flutter 利用的渲染需要,但你能够抉择退出 Impeller。如果抉择退出,请思考在 GitHub 上提交问题,通知 Flutter 官网起因。利用用户可能会留神到 Skia 和 Impeller 在渲染方面存在轻微差别。这些差别可能是谬误,因而请不要犹豫提交问题。在将来的版本中,Flutter 官网将删除 iOS 上的旧版 Skia 渲染器,以减小 Flutter 的大小。

Impeller 的 Vulkan 后端仍在继续开发中。Impeller 在 Android 上仍处于踊跃开发阶段,但尚未筹备好进行预览。Flutter 官网打算在不久的未来分享更多相干内容。

要理解 Flutter 官网的停顿,请查看 Flutter 官网的 GitHub 我的项目板。

与性能(Performance)无关的更新

3.10 版本除了 Impeller 之外,还蕴含了更多性能改良和修复。

打消卡顿

Flutter 官网要感激开源贡献者 luckysmg。他们发现能够从 Metal 驱动程序中缩小获取下一个可绘制层的工夫。要取得此劣势,你须要将 FlutterViews 的背景色彩设置为非空值。这个扭转打消了在最新的 iOS 120Hz 显示器上的低帧率问题。在某些状况下,帧率进步了 三倍。这帮忙 Flutter 官网解决了六个以上的 GitHub 问题。这个扭转十分重要,Flutter 官网将一个修复补丁回溯到了 3.7 版本中。

在 3.7 稳定版中,Flutter 官网将本地图片的加载从平台线程移到 Dart 线程,以防止提早平台线程的 vsync 事件。然而,用户留神到这个在 Dart 线程上的额定工作也引起了一些卡顿问题。在此版本中,Flutter 官网将本地图片的关上和解码从 Dart 线程移到了后盾线程。这个扭转打消了在具备大量本地图片的屏幕上可能呈现的长时间暂停,同时防止了提早 vsync 事件。在 Flutter 官网的本地测试和自动化基准测试中,这个扭转将多个同时加载的图片的加载工夫缩短了一半。

Flutter 官网持续在 Flutter 的新外部 DisplayList 构造之上构建优化。在此版本中,Flutter 官网增加了基于 R -Tree 的剔除机制。该机制在渲染器中更早地删除绘制操作的解决。这个优化减速了,例如,一个输入在屏幕外的自定义绘制器的渲染。Flutter 官网的微基准测试显示,DisplayList 解决工夫缩小了多达 50%。具备裁剪的自定义绘制器的改良成果可能会有所不同。改良水平取决于暗藏绘制操作的复杂性和数量。

缩小 iOS 启动提早

在利用程序包中进行标识符查找的低效策略减少了应用程序的启动提早。这个启动提早与应用程序的大小成比例增长。在此版本中,Flutter 官网修复了利用程序包标识符查找的问题。这将大型生产应用程序的启动提早缩小了 100 毫秒,约为 30-50%。

减小体积

Flutter 默认应用 SkParagraph 作为文本成型、布局和渲染的默认库,Flutter 官网增加了一个标记以回退到传统的 libtxtminikin库。因为 Flutter 官网对 SkParagraph 有充沛的信念,所以在此版本中 Flutter 官网移除了 libtxtminikin及其标记。这将减小 Flutter 的压缩大小约 30KB。

稳定性

在 3.0 版本中,Flutter 官网在渲染流程的前期启用了一项 Android 性能。这个 Android 性能应用了高级 GPU 驱动程序性能。当只有一个“脏”区域发生变化时,这些驱动程序性能只会从新绘制屏幕的较少部分。Flutter 官网通过晚期的优化和相似成果的图形流水线进一步改良了这一点。只管 Flutter 官网的基准测试后果激励 Flutter 官网这么做,但呈现了两个问题。首先,最大改良的基准测试可能不能代表理论应用状况。其次,反对此 GPU 驱动程序性能的设施和 Android 版本的范畴证实很难找到。思考到停顿无限并且反对无限,Flutter 官网在 Android 上禁用了局部从新绘制性能。

在 Skia 后端上,此性能在 iOS 上依然启用。Flutter 官网预计在将来的版本中与 Impeller 一起启用它。

两个 API 改良

在 Flutter 3.10 中 APNG 解码器与图像加载 API 有所改进。

APNG 解码器

Flutter 3.10 解决了 Flutter 官网最受关注的问题之一。它减少了对 APNG 图像的解码能力。你能够应用 Flutter 现有的图像加载 API 加载 APNG 图像。

图像加载 API 改良

Flutter 备受尊敬的工程总监 tvolkert 对 dart:ui 的图像加载 API 进行了改良。Flutter 官网增加了一个新办法instantiateImageCodecWithSize。它反对以下三个条件的图像加载用例:

  • 加载时纵横比未知
  • 有边界框束缚
  • 原始纵横比束缚

例如,当应用程序尝试从一组可能性中从网络加载并显示一张图片时。

与挪动端(Mobile)无关的更新

iOS

无线调试

当初,你能够在不应用数据线的状况下运行和热重载 Flutter iOS 应用程序了!在胜利将 iOS 设施与 Xcode 进行无线配对后,你能够应用 flutter run 命令将应用程序部署到该设施上。如果遇到问题,请确保 Window > DevicesSimulators > Devices下显示了设施旁边的网络图标。要理解更多信息,请查看 Flutter 官网的文档。

宽色域图像反对

当初,iOS 上的 Flutter 利用能够反对对宽色域图像进行精确渲染。要应用宽色域反对,应用程序必须应用 Impeller,并在 Info.plist 文件中增加 FLTEnableWideGamut 标记。

拼写查看反对

SpellCheckConfiguration()小部件当初默认反对 iOS 上的 Apple 拼写查看服务。要应用此小部件,在 CupertinoTextField 中应用 spellCheckConfiguration 参数进行设置。

自适应复选框和单选按钮

此版本将 CupertinoCheckBoxCupertinoRadio小部件增加到 Cupertino 库中。它们创立与苹果款式相匹配的复选框和单选按钮组件。

Material 复选框和单选按钮小部件增加了 .adaptive 构造函数。在 iOS 和 macOS 上,这些构造函数应用相应的 Cupertino 小部件。在其余平台上,它们应用 Material 小部件。

优化 Cupertino 动画、过渡和色彩

Flutter 3.10 改良了一些动画、过渡和色彩,以与 SwiftUI 相匹配。这些改良包含:

  • 更新 CupertinoPageRoute 过渡
  • CupertinoSliverNavigationBar 中增加题目放大动画
  • CupertinoColors 中增加了几个新的 iOS 零碎色彩

PlatformView 性能

PlatformViews 呈现在屏幕上时,Flutter 会在 iOS 上升高刷新率以缩小卡顿。应用程序用户将在应用程序显示动画或可滚动的 PlatformViews 时留神到这一点。

macOS 和 iOS 能够在插件中应用共享代码

Flutter 当初反对插件的 pubspec.yaml 文件中的 [sharedDarwinSource](https://docs.flutter.dev/development/packages-and-plugins/developing-packages#shared-ios-and-macos-implementations) 键。该键示意 Flutter 应该共享 iOS 和 macOS 的代码。


ios:

pluginClass: PathProviderPlugin

dartPluginClass: PathProviderFoundation

sharedDarwinSource: true

macos:

pluginClass: PathProviderPlugin

dartPluginClass: PathProviderFoundation

sharedDarwinSource: true

利用扩大的新资源

Flutter 官网增加了文档,供 Flutter 开发人员应用 iOS 利用扩大。这些扩大包含实时流动、主屏幕小组件和共享扩大。

为了简化创立主屏幕小组件和共享数据,Flutter 官网在 [path_provider](https://github.com/flutter/packages/pull/3450)homescreen_widget插件中增加了新的办法。

跨平台设计的新资源

文档当初包含了针对特定 UI 组件的跨平台设计思考。要理解更多对于每个 UI 组件的信息,请查看 Flutter UX GitHub 存储库中的探讨。Flutter 官网非常感谢任何意见或反馈!

Android

Android CameraX 反对

Camera X 是一个 Jetpack 库,能够简化在 Android 利用中增加丰盛的相机性能。这个性能实用于各种 Android 相机硬件。在这个版本中,Flutter 官网为 Flutter 相机插件增加了对 CameraX 的初步反对。这个反对涵盖了以下用例:

  • 图像捕获
  • 视频录制
  • 显示实时相机预览

如果你想尝试,请抉择应用 CameraX 实现。要抉择应用 CameraX,请在你的 pubspec.yaml 文件中增加以下行。

Dependencies:

camera: ^0.10.4 # 最新的相机版本

camera_android_camerax: ^0.5.0

Flutter 官网十分心愿听到你的反馈意见,因为 Flutter 官网将持续增加更多的 CameraX 性能,并将 CameraX 作为默认实现。

DevTools

Flutter 官网持续改良 DevTools,这是一套用于 Dart 和 Flutter 的性能和调试工具。一些亮点包含:

  • DevTools UI 应用了 Material 3,这既现代化了外观,又加强了可拜访性。
  • DevTools 控制台反对在调试模式下对运行中的利用进行评估。在此版本之前,只有在暂停利用时能力进行评估。
  • 嵌入式的 Perfetto 跟踪查看器代替了之前的时间轴跟踪查看器。Perfetto 解决更大的数据集,并且比传统的时间轴跟踪查看器性能更好。Perfetto 还包含更多功能,例如:
  • 容许你固定感兴趣的线程。
  • 单击并拖动以抉择来自多个帧的多个时间轴事件。
  • 应用 SQL 查问从时间轴事件中提取特定数据。

要理解更多信息,请查看 DevTools 2.23.1、DevTools 2.22.2 和 DevTools 2.21.1 的发行阐明。

弃用的 API 和一些重大更新

弃用和重大变更

弃用的 API

这个版本中的重大变更包含自 v3.7 公布之后过期的已弃用 API。要查看所有受影响的 API,以及其余上下文和迁徙指南,请查看此版本的弃用指南。Dart Fix 能够解决许多这些问题,包含 IDE 中的疾速修复和应用 dart fix 命令进行批量利用。

Android Studio Flamingo 降级

在将 Android Studio 降级到 Flamingo 版本后,当尝试运行 flutter runflutter build你的 Flutter Android 利用时,可能会呈现谬误。这个谬误是因为 Android Studio Flamingo 将其捆绑的 Java SDK 从 11 更新到 17 导致的。当应用 Java 17 时,早于 7.3 的 Gradle 版本无奈运行。Flutter 官网更新了 flutter analyze --suggestions 以验证此谬误是否是因为你的 Java SDK 和 Gradle 版本之间的不兼容性引起的。

要理解修复此谬误的不同办法,请查看 Flutter 官网的迁徙指南。

弃用 Window 单例

此版本弃用了 window 单例。依赖于它的应用程序和库应该迁徙到其余计划。这样能够为你的应用程序做好在将来版本的 Flutter 中启用多窗口反对的筹备。

框架(Framework)方面的更新

Material 3

Material 库当初与最新的 Material Design spec 相匹配。这些变动包含新的组件和组件主题,更新的组件视觉效果等。开发人员必须应用 useMaterial3 主题标记“抉择退出”这些变动。在下一个稳固版本中,useMaterial3 将默认为 true。

接下来会将 Material 3 统称为 M3

如果要抉择应用 Material 库的 M3 版本,请在 MaterialApp 主题中设置 useMaterial3: true。当创立一个新利用时,flutter create 命令会在你的主题中增加这个设置。

也可通过 Flutter 的 demo app 工程来查看 useMaterial3 的成果。

ColorScheme.fromImageProvider()

M3 的所有组件都配置了主题的“ColorScheme”的默认色彩。默认的色彩计划应用紫色的不同深浅。你能够依据单个“seed”色彩或图像创立自定义的色彩计划。在演示中尝试这两种变动。生成的色彩计划应该看起来难看且易于应用。

NavigationBar

这是一个提供了 M3 版本的 BottomNavigationBar 小部件。尽管 M3 应用了不同的色彩、高亮和高度,但它的性能与以前一样。要笼罩 NavigationBars 小部件的默认外观,能够应用 NavigationBarTheme 小部件。尽管不须要将现有利用迁徙到该组件,但对于新利用应该应用它。

NavigationDrawer

这是一个基于抽屉小部件的 M3 指标抉择小部件。NavigationDrawer 显示了一个单选列表,其中蕴含了 NavigationDestinations 小部件。你还能够在这个列表中蕴含其余小部件。当须要时,NavigationDrawer 能够滚动。要笼罩 NavigationDrawers 小部件的默认外观,能够应用 NavigationDrawerTheme 小部件。

SearchBar 和 SearchAnchor

这些组件为搜寻查问提供了预测文本性能。当用户输出搜寻查问时,应用程序在“搜寻视图”中计算出匹配的响应列表。用户能够抉择其中一个响应,或者调整查问。要笼罩这些组件的 M3 设计,能够应用 SearchBarThemeSearchAnchorTheme 小部件。

Secondary Tab Bar

M3 容许你创立一个第二层的分页内容。要辨别这个第二个 Tab 栏,能够应用 TabBar.secondary。

M3 中的日期选择器(DatePicker)更新

M3 的 DatePicker 更新了日历和文本框版本的小部件的色彩、布局和形态。这并不扭转 API,但增加了一个新的 DatePickerTheme

M3 中的工夫选择器(TimePicker)更新

M3 版本的工夫选择器(TimePicker)与日期选择器(DatePicker)一样,对惯例和紧凑版本的小部件进行了色彩、布局和形态的更新。

M3 中的底部弹出窗(BottomSheet)更新

除了 M3 版本的色彩和形态更新外,底部弹出窗(BottomSheet)当初减少了一个可选的拖动手柄,当设置 showDragHandletrue时会显示。

M3 中的列表项(ListTile)更新

M3 版本的列表项(ListTile)更新了小部件的定位和间距。包含内容填充、前导和尾部小部件的对齐形式、最小前导宽度和垂直间距。API 放弃不变。

M3 中的抽屉(Drawer)更新

M3 版本的抽屉(Drawer)更新了色彩和高度,并进行了一些小的布局调整。

M3 中的文本输入框(TextField)更新

M3 对所有的文本输入框(TextField)小部件进行了更新,以反对原生手势操作。在鼠标上双击或三击与在触摸设施上双击或三击的成果雷同。默认状况下,TextFieldCupertinoTextField 小部件都应用这些性能。

TextField 双击 / 点击手势

  • 双击 + 拖动:在词块之间进行扩大抉择。
  • 双击 + 拖动:在词块之间进行扩大抉择。

TextField triple click/tap gestures

三击

  • 在多行的 TextField 中,当点击地位处于段落块内时,会抉择该段落块(Android/Fuchsia/iOS/macOS/Windows)。
  • 在多行的 TextField 中,当点击地位处于行块内时,会抉择该行块(Linux)。
  • 在单行的 TextField 中,会抉择所有文本。

三点触控

  • 在多行的 TextField 中,当点击地位处于段落块内时,会抉择该段落块。
  • 在单行的 TextField 中,会抉择所有文本。

三击 + 拖动

  • 在段落块内进行扩大抉择(Android/Fuchsia/iOS/macOS/Windows)。
  • 在行块内进行扩大抉择(Linux)。

Flutter 反对 SLSA Level 1

Flutter 框架当初合乎软件构建供应链安全级别(SLSA)Level 1 规范。这意味着施行了许多平安性能,包含:

  • 脚本化的构建过程。Flutter 的构建脚本当初反对在受信赖的构建平台上进行自动化构建。在受爱护的架构上进行构建有助于避免构建产物被篡改,进步供应链的安全性。
  • 多方审批和审计日志。Flutter 的公布流程仅在多个工程师的批准后才执行。每个执行都会生成可审计的日志记录。这些更改确保没有人能够在源代码和构建产物生成之间引入批改。
  • 起源可信性。Beta 版和稳定版当初应用起源可信性进行构建。这意味着构建框架公布产物的起源是可信赖的,并且具备预期的内容。每个公布都会提供链接,以查看和验证在 SDK 存档上的起源可信性。

这项工作还使团队可能朝着合乎 SLSA L2 和 L3 的要求迈进。这两个级别专一于爱护构建过程中和之后的构建产物。

Web 方面的更新

Flutter web 利用改善了加载工夫

该版本减小了图标字体的文件大小,并删除了 Material 和 Cupertino 中未应用的字形。

CanvasKit 减小了所有浏览器的大小

基于 Chromium 的浏览器能够应用一个更小的自定义 CanvasKit 版本。托管的 CanvasKit 通过 Google 行业当先的 CDN 进行提供。这应该进一步提高性能。

元素嵌入

你当初能够从页面中的特定元素提供 Flutter web 利用。在此版本之前,你的应用程序只能填满整个页面或显示在 iframe 标签中。能够在 GitHub 中找到示例代码。

着色器反对

Web 利用能够应用 Flutter 的片段着色器反对。


欢送关注「慕课网」官网帐号,咱们会始终保持提供 IT 圈优质内容,分享干货常识,大家一起独特成长吧!

本文原创公布于慕课网,转载请注明出处,谢谢合作

退出移动版