Technology |

Flutter 3.0 Released: New Features and Updates

By Zignuts Team on Jul 18, 2022
Flutter 3.0 Update and its new features - Zignuts Technolab

As we all know by now, Google announced the release of Flutter in May 2022. This new awaited 3.0 update comes packed with a variety of new features and improvements. One might also say that Google gave Flutter developers a remarkable summer gift. This truly is a gift, especially as it comes with stable support for macOS and Linux, the backing for apple silicon, and exceptional refinements for web and mobile.

While Flutter started off as an open-source, cross-platform UI development framework, it has now transformed into a programmer-friendly toolkit that helps build much more than just iOS and Android apps. The latest 3.0 is ready to go and comes equipped with new exciting features and support to enhance productivity. It does not end there. Flutter 3.0’s feature list has a lot more in store.

Dart 2.17

The new Flutter 3.0 also comes with a fresh upgrade in the Dart SDK, in the form of a new Dart 2.17. Whether you use Flutter or not, these new enhancements to Dart are available to all developers.

Dart 2.17-Productivity and integration by Michael Thomsen Dart

What stands out in the new Dart is the flexibility developers have, which enables them to extend enums and even override their default functions. Enums can now behave very much like custom-written classes thanks to this.

Enhanced enums with members

enums can use magic inside now!

enum Water {
frozen(32),
lukewarm(100),
boiling(212);

final int tempInFahrenheit;
const Water(this.tempInFahrenheit);

@override
String toString() => "The $name water is $tempInFahrenheit F.";
}
// USAGE
print(Water.frozen); // prints "The frozen water is 32 F."

Super parameters

Super parameters are much easier to read now!

class Citizen {
String? id;
Citizen({this.id});
}
// OLD WAY
class Female extends Citizen {
String? name;
Female({this.name, String? id}) : super(id: id);
}
// NEW WAY
class Male extends Citizen {
String? name;
Male({this.name, super.id});
}

Named args everywhere:

Named parameters can be defined wherever you want!!

class Citizen {
String id;
String name;
Citizen(this.name, {required this.id});
}
// OLD WAY
Citizen('name', id:'id'); // VALID
Citizen(id:'id','name'); // ERROR
// NEW WAY
Citizen('name', id:'id'); // VALID
Citizen(id:'id','name'); // VALID

Flutter 3.0 with stable desktop support

In just a couple of months of Windows stable support, Flutter has presented developers with another much-awaited feature, which is to build production-ready desktop apps.

Google has also focused on supporting Intel and Apple Silicon with Universal Binary. This ensures that Flutter offers a native-like experience on macOS as well. Additionally, Canonical and Google have joined in collaboration so as to offer highly integrated, top-of-the-class development options in Linux as well. There are additional features attached to this stable desktop support, such as;

  • Create platform-rendered menu bars using the platform menu bar widget to on macOS;
  • Support for accessibility services (such as inverted colors and screen-readers) on macOS, Linux, and Windows;
  • Comprehensive support for international text input across all desktop platforms;

The Mac support also includes a productivity app called Superlist, which is all about how Flutter can enable the building of beautiful experiences on the desktop. However, the app is still in the development stages as of this update.

macOS and Linux Support

At the time flutter was released, it was very well received and greatly welcomed by developers. Today, Flutter is considered one of the most versatile and dynamic cross-platform development frameworks.

What started off just with Android and iOS app support, the framework can also be used currently to develop applications for Web, Windows, and more.

With the launch of flutter 3.0, the cumbersome task of developers having to add platforms has now come to a halt. Beginning now, flutter developers can create applications for macOS and Linux devices without much difficulty.

Foldable Phone Support

Through a collaboration with Microsoft, Flutter 3.0 will be able to support foldable mobile devices too. This added feature will generate a dynamic and productive experience for developers.

Fundamental Improvements in Flutter 3.0

The new Flutter update is about more than just expanding the framework’s platform support. Flutter 3 has brought in many other things as well together with its support of Material Design 3.

Apart from this, Flutter is fully native to development for Apple silicon. While Flutter was compatible with M1-powered Apple devices right when it was released. Currently, Flutter takes a complete advantage of Dart’s support for Apple silicon. This enables a much faster compilation on M1-powered devices and support for universal binaries for macOS apps.

1. Menu Cascading and MacOS  System Menu Bar Support

The latest features in Flutter 3.0 include additions for platform-specific integration, interactive models for compilation to build support, extend accessibility, and internationalization.

The update aims to offer flexibility to efficiently utilize the OS and share optimal UI and logic per the needs. The latest features of Flutter accommodates platform support that goes beyond rendering pixels.

Flutter 3.0 was released on: May 11th, 2022 (Google I/O Edition).

Check out the latest release notes of Flutter 3

Flutter API Sample

 

 

 

 

 

 

 

 

The Apple Silicon Mac is currently supported by Flutter 3.

Go through the new macOS install page and use the Apple Silicon download button.

2. Material You Support

One of the major highlights of our discussion of what’s new in Flutter 3 is its switch to Material Design 3. Material Design 3 is Google’s in-house designing language. Team Flutter has provided us a flexible cross-platform design system that transforms your Flutter app into a stunning interactive product.

Material You Support

3. Flutter Firebase

The app publishers need a comprehensive set of tools to help you build, operate, and release your Flutter apps. This includes data storage, authentication, device testing, and cloud functions. Flutter has many third-party integrations like Firebase, AWS Amplify, Sentry, and AppWrite. Firebase is a back-end platform powered by Google, used to build mobile and web applications.

Team Flutter has officially announced a Flutter Firebase integration which will enable a fully supported core part of the Firebase offering.

As per the data from Slashdata’s reports, 62% of Flutter developers use Firebase for developing their Flutter apps. Get started off with this guide to add Firebase to your Flutter app.

  • Firebase Crashlytics:

Now that Firebase’s well-known real-time crash reporting service is integrated with the Flutter Crashlytics plugin, you can track fatal errors in real time.

The features contain critical alerting metrics such as “crash-free users” that let you monitor the stability of your app.

Triaging, prioritizing and solving issues via the Crashlytics pipeline in now very simple. Further, thus been upgraded to enhance the clustering of Flutter crashes.

Firebase Crashlytics

4. Flutter’s Games Toolkit

This time, the Flutter team has concentrated on creating a toolkit for casual games that is simple to use. It provides cloud services, as well as a starter kit of templates and credits for ads.

Flutter Games Toolkit

Fun fact: Flutter engineers have developed a fun pinball game that is powered by Firebase and Flutter’s web support. This showcases the versatility of Flutter 3.0.

Bonus Tip: You can use this Games doc page to develop games on Flutter.

5. Mobile Updates

  • Foldable support for phones:
    What else is new in Flutter 3.0? Well, the repackaged Flutter release incorporates foldable mobile devices. New widgets and features enable you to build dynamic and visually appealing experiences on foldable devices. This feature has been designed in collaboration with Microsoft.
  • Variable refresh rate support for IOS:
    The latest Flutter version supports variable refresh rates and ProMotion displays on iOS devices. This includes iPad Pro and iPhone 13 Pro. The rendering capability can now refresh at up to 120 Hz, which was earlier limited to 60 Hz. The user can now enjoy a smoother browsing experience while watching fast animations.

6. Web Updates

  • Image Decoding:
    Flutter 3.0 has new APIs that can decode images off the main thread asynchronously. The browser’s built-in image codecs help achieve this. What’s more exciting is that this feature speeds up the decoding of images 2x. This makes sure that the main thread is never blocked by clearing the junk built-up in the past.
  • Web app lifecycles:
    The new Flutter app web app lifecycle API for gives you the advantage of controlling the process for bootstrapping your app. You can now make use of the desktop support for your app.

7. Performance Improvement

The Partial repaint feature, which is used when a single rectangular dirty region, is now available on iOS and newer Android devices.

Performance improvements of opacity animations in simple cases. (still under work, will get better with time)

Variable refresh rates are now supported by Flutter on iOS devices with ProMotion displays. Flutter apps can now render at refresh rates up to 120 Hz, as opposed to the 60 Hz limit in the past.

Raster and UI threads are now prioritized to run on Android and iOS than other threads; for instance, the Dart VM background garbage collection threads. This has made way to ~20% faster average frame build times in our benchmark.

We have a new caching mechanism that predicts the rendering complexity of pictures based on the cost of draw operations that it contains. This gives us reduced memory usage without losing any performance.

improved memory usage without losing any performance

improved memory usage without losing any performance

Flutter web now makes use of the ImageDecoder API in supported browsers. This effectively gives us 2x faster image decoding, and ensures that the main thread is never blocked, removing all junk that was caused by images earlier.

Impeller is a new solution that addresses the early-onset jank on iOS and other platforms. Impeller compiles in advance a smaller and simpler set of shaders during the engine build time so that are not compiled while an app is running
(It’s not yet ready for production but is available on iOS.)

To try it out now;
run flutter run —-enable-impeller
or
set FLTEnableImpeller to true in Info.plist

IOS transition animation of the Gallery app is around 20x faster now.

Flutter 3.0 Performance Improvements

The Flutter engineering team has taken the Flutter performance enhancement to the next level by benchmarking to assess the benefits of optimizing. Most importantly, for simple case scenarios, the opacity animation performance has been improved.

For example, when an Opacity widget consists of a single rendering primitive, the saveLayer method is skipped and is usually invoked by Opacity. 

The Flutter 3 update brings in a mechanism that predicts and quantifies the rendering picture complexity based on the drawing operations cost contained by it. This approach is used to reduce memory usage without a regression in Flutter app performance.

What will you See Next in Flutter?

One of the significant hallmarks present in Flutter 3.0 is that it has extended its reach to the 6 most extensive platforms: Android, iOS, Web, Windows, macOS, and Linux. Now the main question that might arise is “what’s next?” 

As per Tim Sneath, Flutter’s product manager at Google, creating support for those platforms was meant to give Flutter a robust foundation to develop upon.

Google is expected to continue to build upon it in two major avenues: firstly, to revamp developer productivity and secondly, to expand on what Flutter can do in the near future. 

In conclusion, this is what is new in Flutter 3.0, in regards to its important upgrades and dynamic feature, and what lies ahead for this incredible platform.

Are you looking for high quality Flutter app development services?

We can help you turn your idea into reality with a free consultation!

Enquire Now