Flutter Update 3.13: Discover What's New and Improved!

Good news for app developers and enthusiasts! The Flutter 3.13 update is here. In a short span of just three months, the Flutter community has been hard at work, introducing a range of new features and improvements. For a full rundown, you can always visit the official Flutter website. But for now, let's quickly dive into the key highlights of Flutter 3.13.

Short overview

Here's a snapshot of what's new:

  1. Engine & Renderer: Flutter introduces the Impeller renderer, boasting enhanced performance on iOS, a macOS preview, and a new API tailored for foldable devices.
  2. Framework: The update brings Material design enhancements, advanced TextField and Dialog features for iOS, and Cupertino DatePicker and Radio upgrades, complemented by innovative scrolling capabilities.
  3. Accessibility: The CupertinoSwitch sees a notable property update for improved user interaction.
  4. Platform: Flutter 3.13 extends its support to Android 14 while also refining iOS functionalities.
  5. Games: The release broadens the game development toolkit, offering more resources for developers.
  6. Tooling: DevTools provides significant performance and usability enhancements.

With these highlights in mind, let's delve deeper into each segment to understand the transformative changes this update brings to the table.

Engine & Renderer

Flutter 3.13 introduces core enhancements, from improved iOS performance to support for foldable devices:

1. Enhanced iOS Performance with Impeller

Flutter 3.13 has significantly boosted the performance of the Impeller renderer on iOS. The average frame rasterization time in the Flutter Gallery transitions performance benchmark on an iPhone 11 has been halved compared to its predecessor, Skia. This ensures a smoother and more responsive user experience on iOS devices, leading to better user engagement and satisfaction.

2. Fidelity Improvements

Building on the 3.10 release, wide gamut colors, initially available under a flag with Impeller, are now the default on iOS. This adjustment ensures apps display richer and more vibrant colors, enhancing the visual appeal and making apps more engaging for users.

3. Progress on Impeller for Android

While the Vulkan backend for Impeller on Android is still under development, the OpenGL and Vulkan backends have seen benefits from backend agnostic optimizations made to Impeller's HAL over the past year. This promises smoother app experiences for Android users in the near future, ensuring optimal app performance across platforms.

🌋
Vulkan is a modern graphics tool, Vulkan offers a more efficient way for apps to communicate with a device's graphics hardware, replacing older methods like OpenGL. It ensures better graphics performance and smoother app experiences.
💡
HAL (Hardware Abstraction Layer) acts as a bridge between software and hardware, ensuring that software can work with different hardware components without needing to understand the specifics. In the context of Impeller, HAL optimizations mean better graphics rendering and faster app performance.

4. Impeller on macOS

Following positive feedback from its iOS implementation, Impeller is now available in preview for macOS. This move signifies Flutter's commitment to consistent app performance across Apple devices, ensuring macOS users enjoy enhanced app responsiveness and visual fidelity.

5. New Engine API for Foldable Devices

Recognizing the emerging trend of foldable devices, Flutter 3.13 introduces a new API to retrieve various display properties. This ensures apps are tailored and optimized for these unique screens, providing a seamless user experience on the latest devices.

Foldable device

In summary, Flutter 3.13 brings significant enhancements, emphasizing performance and adaptability. With the Impeller renderer now optimized for both iOS and macOS, Flutter aims for consistent, top-tier experiences across platforms. These updates, driven by user feedback and tech trends, set a new standard in app development.

Framework

From advanced text recognition to dynamic scrolling, Flutter 3.13 brings a suite of innovative features:

1. TextField Character Recognition

On iOS, the TextField now offers a camera-based character recognition feature. This innovative addition, a collaborative effort of community members, allows users to input text by simply scanning it, streamlining the data entry process.

2. Platform-Adaptive Dialog

The update introduces an adaptive constructor for the AlertDialog. This ensures that apps display dialogs that resonate with the platform's native design, offering a consistent user experience across devices.

3. Cupertino Enhancements

Several Cupertino components have been upgraded:

  • DatePicker: Now includes a monthYear mode.
  • Radio: A new useCheckmarkStyle property allows for a checkmark style on iOS.

4. Material Widget Customizations

Flutter 3.13 provides more flexibility in designing Material widgets. From customizing the error widget in text fields to adding tooltips to ButtonSegment and adjusting the alignment in TabBar, developers have a plethora of options to tailor the user interface.

The update introduces elevated variants of FilterChip, ChoiceChip, and ActionChip in line with Material 3 specs. Additionally, the SearchBar now supports an onSubmitted feature, enhancing user interaction.

6. Gesture Recognizers

A new base class, BaseTapAndDragGestureRecognizer, has been added. This supports various gestures, including tap + pan and tap + horizontal drag, proving beneficial for native text field gestures and other interactive elements.

7. App Lifecycle

The AppLifecycleListener class monitors changes in the app lifecycle, allowing developers to respond to specific lifecycle events, including app exit requests.

8. Scrolling Innovations

Flutter 3.13 lays the foundation for two-dimensional scrolling, introducing several new classes and interactions, including diagonal scrolling. This enhancement, backed by a user study, offers developers a robust framework for crafting dynamic scrolling experiences. For a hands-on look, check out this example of a simple, lazy loading, two-dimensional grid implemented in DartPad. Additionally, new slivers like SliverMainAxisGroup and SliverCrossAxisGroup have been introduced, enabling unique scrolling effects.

New Flutter version allows greater customization, and introduce new capabilities. This ensures apps are more versatile and can cater to a broader range of user preferences.

Accessibility

Enhanced accessibility features in Flutter 3.13 ensure a comprehensive user experience:

1. CupertinoSwitch's onOffSwitchLabels

The addition of the onOffSwitchLabels property for CupertinoSwitch allows users to easily discern the switch's state by displaying I/O labels. This enhancement not only provides immediate feedback but also ensures a clearer and more intuitive user interface, especially beneficial for those who rely heavily on visual cues.

Switch labels

2. FocusSemanticEvent

The introduction of FocusSemanticEvent offers developers an additional tool to manage focus events. However, it's crucial to use it judiciously to maintain the expected behavior of a11y focus, ensuring that user interactions remain consistent and intuitive.

💡
The term "a11y" is shorthand for "accessibility", with "a" representing the first letter, "11" signifying the eleven letters between the first and last letters, and "y" being the last letter.

3. IconButton’s isSelected for Screen Readers

With the isSelected property of IconButton now accessible to screen readers, visually impaired users can be better informed about the selection state of interactive elements. This improvement underscores the importance of providing comprehensive feedback to all users, fostering a more inclusive app environment.

In conclusion, the Accessibility updates in Flutter 3.13 highlight the platform's dedication to inclusivity, Flutter ensures that apps cater to all users, promoting a seamless and comprehensive user experience.

Platform

Flutter 3.13 ensures optimized performance and compatibility across both Android and iOS platforms:

Android

Flutter 3.13 now supports Android 14/API 34, ensuring developers can build apps optimized for the latest Android version.

iOS

1. Rotation Distortion Fix: Flutter has minimized screen rotation distortion, aligning the visual experience closer to native iOS apps.

2. Naming Flexibility: Developers can now rename the default "Runner" Xcode project, aiding in better project organization.

3. Ready for iOS 17 and Xcode 15: Flutter 3.13 is optimized for the upcoming iOS 17 and Xcode 15, recommending the concurrent download of the iOS 17 simulator.

These updates highlight Flutter's dedication to enhancing cross-platform development, ensuring apps maintain consistency and quality across Android and iOS.

Games

The game development toolkit in Flutter sees notable enhancements:

Since launching the Flutter casual games toolkit in 2022, tens of thousands of games have been developed. Responding to developer feedback, Flutter has enhanced the toolkit with more resources, available on their updated web page. A notable collaboration in 2023 with AdMob, Google's mobile advertising platform, led to a specialized workshop for game developers. Continuous improvements are underway, with Flutter welcoming feedback.

Tooling

Refined tools in Flutter 3.13 aim to streamline the development process:

Flutter's DevTools has undergone notable improvements to boost its performance and user experience. Key updates include a new overflow menu for better navigation, a legend for class types in the Memory tab, and enhanced scrolling in the CPU profiler. Searching functionalities within the debugger have also been optimized, achieving speeds up to five times faster. For a detailed overview, refer to the release notes for DevTools 2.25.0 and DevTools 2.24.0.

Breaking changes

Flutter 3.13 shifts gears with Material 3 adoption and Android updates. Here's what to know:

In the forthcoming Flutter stable release, there's a shift towards embracing Material 3 as the default, offering enhanced colors, text styles, and visuals. Preview the differences between the current Material 2 and upcoming Material 3 using the Material 3 demo.

On the Android front, Flutter has phased out support for Android Jelly Bean API levels (16, 17, and 18). Most apps will transition to the new minSdkVersion automatically, but manual adjustments might be required for some. Plugin authors should also ensure their plugins are updated accordingly.

This release also sees the retirement of certain APIs that were marked for deprecation post the v3.10 release. Comprehensive migration guides and context are available, with many changes supported by Flutter Fix for seamless transitions.

Dart 3.1

Dive into Dart 3.1's latest offerings, from its evolution post the 3.0 release to its anticipated support for Wasm:

Along with Flutter 3.13, Dart 3.1 has been released, marking the first stable version since 3.0 in May. While 3.0 was transformative, introducing features such as record types, pattern matching, and a commitment to "100 percent sound null safety", the 3.1 version hints at the future, especially with the anticipated support for Wasm (WebAssembly).

🔎
WebAssembly, often abbreviated as Wasm, is a low-level, binary instruction format designed to run code at near-native speed in web browsers. It allows developers to execute code written in languages other than JavaScript, like C and Rust, directly in the browser, enhancing web application performance and capabilities.

Post the 3.0 release, the Dart team has been concentrating on new roadmap items, with a significant emphasis on the functional programming capabilities of Dart. The introduction of Wasm support, currently in preview, is particularly noteworthy as it signals a shift in browser-based applications, with the Flutter team envisioning a move from traditional HTML to frameworks targeting WebGL and Wasm.

In a nutshell, Dart 3.1 is setting the stage for an innovative future in web development, emphasizing open standards like Wasm.

Summary

Flutter 3.13 introduces a slew of enhancements that promise to redefine app development. The Impeller renderer, previously optimized for iOS, now extends its prowess to macOS, ensuring consistent performance across Apple devices. Innovations like camera-based text recognition in TextField and the foundation for two-dimensional scrolling showcase Flutter's commitment to user-centric features and adaptability.

This release also paves the way for the adoption of Material 3, providing developers with enriched design tools for crafting captivating apps. Concurrently, the platform extends its compatibility to Android 14 and refines iOS functionalities, ensuring a seamless experience across both ecosystems.

Alongside, Dart 3.1 continues its evolution, with a spotlight on the upcoming support for WebAssembly (Wasm) – a game-changer for web applications.

Together, Flutter 3.13 and Dart 3.1 are setting new benchmarks, offering developers a suite of advanced tools to craft the next generation of apps.