BLOG
What's New in Flutter 2.2
The Flutter 2.2 release focuses on polish and optimization, including
iOS performance improvements, Android deferred components, updated service worker For Flutter web and more.
Flutter 2.2 updates in stable
This release covers a wide range of improvements on top of Flutter 2, including updates across Android, iOS,
and web, new Material icons, updates to text handling, scrollbar behavior, and mouse cursor support for the Text Span widget and new guidance on how to best support multiple kinds of platforms from a single source code base. All of these features are available in stable now and available for your use in production apps. And all of them are built on a new release of Dart.
Type aliases make it possible to give nice short names to long, complicated types, and it also lets you rename your classes in a non-breaking way.
Flutter web updates
Flutter’s newest stable platform, web, has been improved in this release.
​
To start, we optimized caching behavior with a new service worker-loading mechanism, and fixed double-downloading of main.dart.js. In previous versions of Flutter web, the service worker downloaded updates to your app in the background while giving your user access to the stale version of your app. Once that update was downloaded, the user wouldn’t see those changes until they refreshed the browser page a couple times. As of Flutter 2.2, when the new service worker detects a change, the user will wait until the updates are downloaded to use the app, but then they’ll see the updates without requiring a second manual refresh of the page.
​
Enabling this change requires you to regenerate the index.html of your Flutter app. To do that, save your modifications, delete the index.html file, and then run flutter create. In your project directory to recreate it.
​
We also made improvements to both web renderers. For HTML, we added support for font features to enable setting Font Feature as well as using canvas APIs to render text so that it appears in the correct place when hovering. For both HTML and CanvasKit, we added support for shader masks and computeLineMetrics, addressing the parity gaps between Flutter web and mobile apps. For example, developers can now use opacity masks to perform fade-out transitions with shader masks, and use computeLineMetrics as they would for mobile apps.
​
For Flutter web, as well as Flutter in general, accessibility is one of our top priorities. As designed, Flutter implements accessibility by building a SemanticsNode tree. Once a Flutter web app user enables accessibility, the framework generates a DOM tree parallel to the RenderObject DOM tree, and translates the semantic properties to Aira. In this release, we improved semantic node position to close the gap between mobile and desktop web apps when using transforms, which means that the focus box should appear properly over elements when widgets are styled with transforms.
​
We also exposed the semantics node debug tree with a command line flag in profile and release modes to help developers debug accessibility by visualizing the semantic nodes created for their web app.
In builds available on the master and dev channels beyond the 2.2 stable release, we’ve added an API to let developers programmatically auto-enable accessibility for their apps and are fixing issues with using Tab with screen readers.
And last but certainly not least, the latest version of Flutter DevTools now supports the layout explorer for your Flutter web apps.
Dart 2.13
Flutter 2.2 comes with the Dart 2.13 release. Among other things, this Dart update contains a new type aliases feature, which enables you to create aliases for types as well as for functions:
To enable this for your own Flutter web app, run the following:
​This update gives you the same layout debugging tool on the web that we used to with your mobile and desktop apps.
IOS page transitions and incremental installs
For iOS, in this release the page transition smoother in Cupertino by reducing the time it takes to render the frames of the animation by 75%, and potentially more on low-end phones. We don’t just look for end-user performance improvements; we’re always looking for ways to improve the development performance as well.
In this release, we have implemented incremental iOS installs during the development process. In our benchmarks, we’ve seen a 40% decrease in the amount of time to install an updated version of your iOS app, which decreases your turn-around time when testing app changes.
Use Flutter to build platform adaptive apps
As Flutter expands to support more platforms in stable, it becomes useful to consider apps that support not just different form factors, such as mobile, tablet, and desktop, but also different input types (touch vs. mouse keyboard) and platforms with different idioms, such as navigation drawers vs. system menus for navigation. We call apps that can adjust to the details of different target platforms to be “platform adaptive” apps.
​
For an introduction to the considerations you’ll want to keep in mind when building platform adaptive apps, point you at the Building platform adaptive apps session from Kevin More.
Therefore, until now, the only way to avoid this jank on iOS was to simplify scenes and animations, which was not ideal.
​
However, right now on the dev channel is a preview of the new support in Skia for shader warm-up for Metal. Through Skia, Flutter now compiles the bundled shaders before the first frame workload begins.
Traces showing precompilation occurring during application launch
Flutter Package updates
As part of this release, the Flutter Ecosystem Committee has been working hard to certify 24 new Flutter Favorite packages, our largest expansion yet. The newly tagged Flutter Favorites include:
​
FlutterFire packages in production:
cloud_firestore, cloud_functions, firebase_auth, firebase_core, firebase_crashlytics, firebase_messaging, and firebase_storage
​
Flutter Community “plus” packages:
android_alarm_manager_plus, android_intent_plus, battery_plus, connectivity_plu, device_info_plus, network_info_plus, package_info_plus, sensors_plus, and share_plus
googleapis package
win32 package
intl and characters packages
Sentry packages:sentry and sentry_flutter
infinite_scroll_pagination and flutter_native_splash packages
All of these packages have been migrated to null safety and support Android, iOS, and web as appropriate.
For example, firebase_crashlytics has no underlying SDK on the web, and android_alarm_manager_plus is specifically designed for Android.
​
The Flutter Community “plus” packages provide a superset of the corresponding packages from the Flutter team.
For example, the battery package has been provided by the Flutter team at Google since before the initial Flutter release and has been migrated to null safety, but is only supported on Android and iOS. The Flutter Community battery_plus package, on the other hand, supports all six Flutter platforms, including web, Windows, macOS, and Linux. The award
of the Flutter Favorite awards for all 9 of the “plus” packages represents a big step forward in maturity for the Flutter community as a whole. Flutter is much, much larger than just what the teams of engineers at Google are doing.
Akshata Ghorpade
​Kushagramati
