 |
| Flutter 3.24.2 |
Hello, today our topic is the latest version of Flutter 3.24.2.
Flutter 3.24.2 is an update that offers significant improvements in terms of performance and usage. Let’s take a look at what’s new with the new version and see how these features can be integrated into applications.
May innovations bring productivity to all of us. Let’s get started.
1. Impeller Rendering Engine
Impeller is a new performance-orientated rendering engine developed with Flutter 3.24.2. Designed to replace Skia, Impeller offers major improvements, especially in GPU-based animation and graphics processing. Impeller enables the development of more stable and high frame rate applications. Currently, Impeller is supported on iOS and Android platforms.
What has changed?
- Impeller provides lower latency, especially in animation-intensive applications.
- By optimising the shader compilation time, it prevents stuttering during animations.
How to use: To test the Impeller rendering engine, we can compile our application with the following command:
flutter build apk --impellerTo use Impeller on all platforms by default, we just need to add the following setting to the pubspec.yaml file:
flutter:
impeller:
enabled: trueThis feature has been introduced to significantly improve performance, especially in graphics-intensive applications.
2. Material 3 Improvements
Material 3 (M3) support has been further strengthened with Flutter 3.24.2. Material 3 is a framework that reflects Google’s latest design language, allowing us to more easily integrate modern and dynamic UI designs into our application. M3 offers a more consistent user experience on mobile, web and desktop platforms with adaptive components and responsive design features.
What has changed?
- In particular, M3 offers new colour palettes, adaptable typography and greater flexibility in components.
- Basic components such as ElevatedButton, OutlinedButton and TextButton are now automatically shaped according to M3 themes.
Example Usage: To enable Material 3, we can use the useMaterial3: true flag in ThemeData:
MaterialApp(
theme: ThemeData(
useMaterial3: true, // Activates Material 3
colorScheme: ColorScheme.fromSeed(seedColor: Colors.teal),
),
home: Scaffold(
appBar: AppBar(title: Text("Material 3 Improvements")),
body: Center(
child: ElevatedButton(
onPressed: () {},
child: Text("Material 3 Button"),
),
),
),
);This is intended to ensure a consistent and modern look, especially on devices with very different screen sizes.
3. NewWidget: MenuBar
With Flutter 3.24.2, the MenuBar widget is now available, which is especially needed for desktop applications. MenuBar allows us to easily integrate the top menu bars from traditional desktop applications into Flutter applications. This significantly improves the user experience, especially on desktop platforms.
What has changed?
- Adding menu bars to Flutter apps just got a lot easier.
- The MenuBar widget is integrated with Flutter’s desktop support to offer platform-specific menu experiences.
Example Usage:
Scaffold(
appBar: AppBar(
title: Text('Flutter 3.24.2 Menu Example'),
),
body: MenuBar(
children: <Widget>[
SubmenuButton(
menuChildren: <Widget>[
MenuItemButton(
onPressed: () {
// Creating a new file
},
child: Text('New File'),
),
MenuItemButton(
onPressed: () {
// Opening a file
},
child: Text('Open'),
),
],
child: Text('File'),
),
SubmenuButton(
menuChildren: <Widget>[
MenuItemButton(
onPressed: () {},
child: Text('Cut'),
),
MenuItemButton(
onPressed: () {},
child: Text('Copy'),
),
],
child: Text('Edit'),
),
],
),
);This widget allows us to create a professional menu system in our desktop applications.
4. Developments in Supported Platforms
Flutter 3.24.2 introduced further improvements for desktop and web platforms. In particular, system integrations optimised for macOS and Linux applications allow Flutter to run more efficiently on these platforms.
What has changed?
- System integrations for macOS and Linux have been improved. More hardware access is now available on these platforms.
- Significant improvements in web performance, especially for web applications working with large data sets and interactive content.
Example Usage: To use platform-specific features, we can access system features through platform channels. For example, to access the file system on desktop platforms:
if (Platform.isMacOS || Platform.isLinux) {
// Perform a platform-specific operation such as a file selector
}This enables our Flutter application to take advantage of features specific to the target platform.
5. Performance Improvements
Flutter 3.24.2 also includes many important improvements on the performance side. Especially in applications with large and complex animations, smoother transitions are provided, while overall rendering performance has been optimised.
What has changed?
- Flutter’s performance monitoring tools (DevTools) have been further enhanced. Now we can more easily identify performance bottlenecks.
- Render time has been optimised, resulting in a better performance experience, especially on low-power devices.
Example Usage: We can detect performance issues in our application by using performance monitoring tools. By analysing performance through DevTools, we can make improvements for animations and UI components.
flutter run --profileBy running it in profile mode, we can monitor the performance of our application and discover areas where we can make optimisations.
Flutter version 3.24.2 offers significant improvements, especially in terms of performance and user experience. The Impeller rendering engine, Material 3 improvements, MenuBar widget, and platform support allow developers to create modern and powerful applications. By updating our apps with these new features, we can provide our users with a faster, sleeker and more responsive experience.
I also share the link to Flutter’s official documentation on the subject below:
Good coding to all of us.
Selin.
