Google Has Brought Out The Big Guns With Flutter 2.5

Flutter 2.5 is here, and trust us; it is more feature-loaded than ever. The Flutter 2.5 release is a big one coming in a close second to the top spot of Flutter releases. With 4600 issues resolved and 3392 PRs merged, Flutter 2.5 has 252 contributors and 216 reviewers. Flutter 2.5 release ensures that your development team is supported by all the features it will ever need for a penultimate quality level.

The Flutter 2.5 release sports a wide variety of performance and toolset improvements, making it a lot easier to deal with performance issues in your app. It also sports features like full-screen support for Android, reworked text editing, and keyboard shortcut switchability. Flutter 2.0 was a robust framework capable of feats its peers would struggle at. Upping the ante even further, Flutter 2.5 is chock-a-block with exciting new features, upgrades, and modifications, and we can't wait to tell you all about it. So without further ado, let's get to it.

What’s New In Flutter 2.5?

1. Performance

• iOS shader warmup
• Async tasks
• GC & message passing

Flutter 2.5 rolls in with a plethora of performance enhancements. Topping the list is a PR that effectively wires up the precompilation of shaders from offline test runs. This reduces worst-case farmer rasters by 2/3. The Flutter team has also made tremendous headway in reducing iOS jank.

In previous releases, animations were interrupted if asynchronous events were processed. With improvements to its scheduling policies, frame processing is prioritized over async events, thus eliminating jank.

Earlier, jank increased when the GC (garbage Collector) paused UI threads to save memory. The DART VM did this but not with optimal efficiency. In a bid to reclaim memory, more GCs were used in previous releases. However, this led to too many GCs and caused memory-constrained devices to freeze.

If you happen to be targeting iOS, we have good news for you. Flutter apps built on Apple Silicon M1 Macs run flawlessly on simulators. This increases performance app testing and is a massive step on the way to achieving complete support in Flutter for Apple Silicon.

Deploy Radixweb’s expert team to deliver stellar Flutter app development.

Connect Now

2. Framework

• Android fullscreen
• Material You
• Text editing shortcuts

Flutter 2.5 supports multiple improvements to the framework. In the case of Android, the team at Flutter has solved issues that enable full screens. The names of these modes are equally interesting: Sticky, Sticky immersive, lean back, edge to edge. With Flutter 2.5, when users engage with the app, you can now write code to return to fullscreen at the point of return of the system UI.

New Android edge-to-edge mode: normal mode (left), Edge to Edge mode (center), Edge to Edge with a custom SystemUIOverlayStyle (right)

You can learn more about pull request on the Flutter GitHub repository.

In Flutter 2.5, developers can now build according to the material You feature, inclusive of updates to action button sizes and themes. Check under MaterialState.strolled to see it in action

New Material You FAB sizes

New MaterialState.scrolledUnder state in action

Since we are talking about scrolling, yet another enhancement is the scroll metrics notifications you get for scrollable areas. Eg. Here is how a scrollbar will appear or disappear based on ListView

The new scroll metrics notifications enabling the scrollbar appearance

For this to happen, the developers don't have to write fresh code. It can be directly captured from ScrollMetricNotification

Flutter 2.5 also supports adding a Material banner to ScaffoldMessenger an upgrade on Flutter 2's way of displaying SnackBars and notifications at the bottom of the screen. With Flutter 2.5, you can now add banners that will stay in place until dismissed.

You can achieve this output by deploying the showMaterialBanner process of ScaffoldMessenger

According to the material guidelines for banners, your app can show only one banner at a time. If showMaterialBanner Is called multiple times, the scaffold manager will create a queue that will display easily dismissable banners from latest to oldest.

Building further on Flutter's extensive text editing features like pivot points in text selection and the capability to halt a keyboard event once deployed. Flutter 2.5 sports the ability to make keyboard shortcuts overridable.

In the DefaultTextEditingShortcuts class, you can find every keyboard shortcut applied across platforms. Flutter's Shortcuts widget can be used to remap shortcuts to custom intent. This widget can be placed anywhere in the widget tree for easy overrides.

3. Flutter DevTools

• Performance
• Widget inspector
• Polish

“Flutter for startups”, we have heard this adage before and it still rings true in the case of Flutter 2.5. Flutter 2.5 comes with a variety of upgrades to Flutter DevTools. Now DevTools can take advantage of Flutter engine updates. These updates facilitate Flutter 2.5 to work better while connecting trace events to specific frames. This helps developers to determine why a frame is overstepping its budget. In the DevTools Frames Chart, which in Flutter 2.5 is 'live,' only frames already rendered are populated in the chart. Once you select a frame, you are sent to the event timeline of the specific frame.

Flutter 2.5 can identify shader compilation events as well. Flutter DevTools can be deployed to help you in diagnosing jank caused by shader compilation.

DevTools detecting lost frames due to shader compilation

With this new feature of Flutter version 2.5, DevTools can detect if there has been a loss of frames. You can also run your app for the first time with Flutter run with the --purge-persistent-cache flag When you do so, the cache is cleared so that you can reproduce 'first run' environments. This feature is still being developed yet shows great promise.

In Flutter 2.5, if you happen to be addressing CPU performance issues, you are no longer overloaded with data from Dart, Flutter libraries, and the engine's native code. Flutter 2.5 supports the functionality of turning off any of these so that you can focus on your code thanks to the CPU Profiler.

For categories you don't plan to filter out, Flutter 2.5 color codes theme for easy location on the CPU frame chart, detailing whence they come from within the system.

Colored frame chart to identify app vs. native vs. Dart vs. Flutter code activities in your app

Flutter 2.5 does a lot more than debug performance. Flutter 2.5 comes with an updated Widget Inspector allowing you to hover over a specific widget and evaluate it, view properties, state, etc.

When a widget is selected, it is automatically reflected in the Widget inspector console, easily visible its properties. IF you happen to pause at a breakpoint, expressions are also available for evaluation from your console.

The Widget Inspector in Flutter 2.5 not only sports new features it has also had a facelift. Dev Tools is now a far more practical destination for debugging.

Flutter DevTools polished UX for greater ease of use

The image above shows the following -

Clearer information on what the debug toggle buttons do- With new icons, labels, and appealing tooltip, the debug toggle buttons are now a lot more informative, assisting in enhanced developer comfort. Each tooltip leads to further feature documentation.

Scanning and locating Widgets- widgets used most frequently are now present in icon form right on the widget tree (besides the inspector). These widgets are color-coded based on type and sport a content preview.

Color Scheme Alignment of the layout explorer- Color coding of the widget according to type enables easy identification, enhancing development ease.

Now build high performing applications with our Flutter development capabilities.

Talk to our experts

4.IntelliJ/Android Studio

• Integration tests
• Test coverage
• Icon previews

Some of the best improvements in Flutter 2.5 are on the IntelliJ/Android Studio plugin. Now developers can run integration and unit tests from testWidgets()

Integration testing your Flutter app in IntelliJ/Android Studio

If you wish to run an integration test or connect the test with Android studio, you can now add a run config to launch the test and connect with a device. Running this configuration facilitates the running of the test, inclusive of setting stepping and breakpoints.

Flutter 2.5 also sports an IJ/AS plugin that allows the developer to see coverage information for integration and unit tests. This feature is accessible from a button on the toolbar.

Flutter 2.5 displays coverage info in the form of red and green bars. In the image below lines, 3 and 4 are not tested, while lines 9 to 13 have already been tested.

Coverage info is displayed using red and green bars in the gutter of the editor. In this example, lines 9–13 were tested, but lines 3 and 4 were not.

Flutter 2.5 can also preview icons used from packages from pub.dev's true type font files.

Icon preview in IntelliJ/Android Studio

In Flutter 2.5, you can enable icon previews by telling the Flutter plugin which package you are using. There is also a new text field on the preferences/plugin settings page.

5. Visual Studio Code

• Dependencies
• Fix All
• Test Runner

Flutter 2.5 sports improvements in the Visual Studio Code plugin, with the addition of two new commands, "Dart: Add Dependency" and "Dart: Add Dev Dependency."

How to add a Dart dependency in Visual Studio Code

The "Dart: Add Dependency" and "Dart: Add Dev Dependency" commands offer a type-to-filter list of packages from pub.dev.

The 'FixAll" command is also interesting given that it can fix all the issues that Dart.fix can right from the file currently open and that too in a single step.

Using Flutter Fix rules to fix all known issues in your code

By adding source.fixAll to the editor.codeActionsOnSave VS Code setting. If you want a preview, you can run Dart.previewVsCodeTestRunner setting and watch your tests run.

Using the new Visual Studio Code test runner test your Dart and Flutter code

Flutter 2.5's Visual Studio Code test runer appears different from Dart's test runner. New gutter icons that display the state of the test are clickable, facilitating the test's running. A right click would cause a drop-down of a context menu.

It is predicted that the Visual Studio test runner will replace Dart and Flutter's traditional test runner.

6. Tools

• Exceptions
• New app template
• Pigeon 1.0

In Flutter's earlier versions, exceptions proved rather frustrating. Developers expected to be unhandled so that they could trigger a debugger. This used to help in finding bug/error locations. But earlier, the Flutter framework did not allow the exception through, thus canceling the 'unhandled exception' situation.

In Flutter 2.5, debuggers are now capable of breaking correctly on unhandled exceptions. Therefore, the debugging experience is greatly improved, given that the developer can now pinpoint the throwing line of code. Another new Flutter 2.5 feature enables developers to choose whether a FutureBuilder should swallow or rethrow errors. This adds numerous exceptions which facilitate the tracking of errors.

From the very beginning, Flutter has sported a Counter app template. This template sports numerous features of the Dart Language and displays several key Flutter concepts. It is small enough to fit in a single file in addition to explanatory documentation. However, a Counter app template is not a good place to begin building a real Flutter App. Flutter 2.5 sports better template accessible through $ Flutter create -t skeleton my\_app

The new Flutter skeleton template in action

Flutter 2.5's skeleton template creates a double-page list view Flutter App following community standards and practices. This template was iteratively developed over many reviews to offer a better base for building an enterprise-grade app with the following features.

ChangeNotifier to connect with and work on multiple widgets

• Default localizations Generations by default
• Example image in 1x, 2x, and 3x folders
• "Feature-first" organization
• Shared preferences
• Double themes
• Navigation

If you want to develop a Plugin instead of an App, Pigeon 1.) is at your service. Pigeon is a code-generation tool that generates typesafe interoperable code between the host platform and Flutter. Pigeon allows you to define APIs and generate skeleton code for Java, Dart, and Objective-C

Sample generated Pigeon code

Pigeon is currently in use in a couple of plugins from Flutter. With Flutter 2.5, Pigeon will come even more in handy given that Flutter now provides more messages, primitive datatypes as arguments, and return types.

Summary

So there you go, all you need to know about Flutter 2.5 and how Google is on the way to striking developer gold with Flutter's latest version. The Flutter community worldwide has pivoted rapidly to adopt Flutter development to reap the benefits of this shiny new toy, and so have we.

As we work on transforming business across the globe, our Flutter App Development Services will help you ship more, faster, and deploy your tech assets to multiple platforms from a single codebase. If you too wish to empower your development initiative with Flutter's latest version, drop us a line, and we will be happy to help. Till then, Happy developing.